How to place an image as background in the heatmap?

[Grischa]

Hi,

 

it is possible in PowerCharts to set an image behind the heatmap as background?

I want to have the image behind the heatmap, not behind the labels. Otherwise it makes no sense.

Because the heatmap must have x-coordinates and y-coordinates of the picture. (not the same labels as in that example.)

example in fiddle

Edited July 18, 2017 by Grischa

[Ayan Bhadury]

Hi,

Kindly confirm where you want to show the image? Is it on the plots which have null values? please confirm

[Grischa]

Hi Ayan,

 

there have to be some little sqare areas of some coords on the body of this person. Like shown on this picture. The areas must have the size of the neck of this person. So the image is the most important issue, not a design.  Every sqare area in the size of the neck have a collection of coordinates.
Polygon-Areas would be the greatest thing, but maybe not with fusionCharts.

 

Edited July 18, 2017 by Grischa

[Grischa]

Hi,

would be just very great, if it was possible to set the picture  not in the labels. Is there anybody who is able to advise me or is that impossible by fusionCharts? 

 

            "chart": {
                "theme": "fint",
                "toolTipColor" : "#333",
                "toolTipBgColor" : "#FFF",
                "bgImage" : "../bilder/1.gif",
                "bgImageValign" : "middle",
        "alpha" : '30',
        "plotFillAlpha" : '30',
                "showPlotBorder": "1"
.
.
.

The Alpha values don't make picture visible. Have the background-property any sense in the heatmap from fusionCharts?

IN FIDDLE

 

Edited July 20, 2017 by Grischa

[Grischa]

[Akash Biswas]

Hi,

Are you looking for any sort of implementation as in the below fiddle :

http://jsfiddle.net/Akash008/bgv553mj/34/

This has the alpha set, to make it transparent so that the image in the background is visible, and the labels are visible in the foreground.

 

Thanks,

Akash.

[Grischa]

Hi Akash,

that is good and useful for me. Thank you very much for this hint. It is possible to set picture also in the center alignment of the heatmap maybe or to set position more right? I did not find something like that in the documentation.

 

 

 

Edited July 20, 2017 by Grischa

[Akash Biswas]

Hi,

Attribute "canvasBgAlpha" reference link : http://www.fusioncharts.com/dev/basic-chart-configurations/canvas.html#changing-the-canvas-fill-color

Attribute "plotFillAlpha" reference link : http://www.fusioncharts.com/dev/basic-chart-configurations/data-plot.html#customizing-data-plot-transparency

Hope this helps.

 

Thanks,

Akash.

[Grischa]

Hi,

I am just very happy with Alpha-possibility. The wish would be also to set picture in pixel to the right or button. Maybe is only possible to align by "bgImageValign" or "bgImageHalign". There is no other possibility?

Edited July 20, 2017 by Grischa

[Akash Biswas]

Hi,

Yes, you could configure the bgImage using the below set of attributes accordingly.

bgImageHAlign, bgImageVAlign : used to align the image vertically and horizontally, respectively.

bgImageScale : used to increase or decrease the scale of the image.

bgImageDisplayMode : used to specify the mode in which the background image is to be displayed.

 

Refer to the documentation link : http://www.fusioncharts.com/dev/basic-chart-configurations/border-and-background.html#customizing-the-background-image

 

Thanks,

Akash.

Edited July 20, 2017 by Akash Biswas

[Grischa]

Thank you, Akash. All that is very helpful.