Image in anychart doesn't fix the stage

Question

I'm trying to put some logos in a chart for print them, but depending of the screen resolution logo at the right sometimes is out of the chart area and sometimes is far of the edge. I'm using stage and putting the logo with graphics.image. This is the code anychart v 8.2.1

var image = anychart.graphics.image("logo_mues2020.png", "12%", "9%",102, 43);
image.parent(container);
image = anychart.graphics.image("gepp2020.jpg", "72%", "9%", 155, 47);          
image.parent(container);

container is a stage

And these are the examples in two different devices https://imagizer.imageshack.com/img924/5741/tmDgQA.png https://imagizer.imageshack.com/img923/7563/QuQJcI.png

does somebody has made something similar? is there a way to fix it with the chart area or make it fit more better and really responsive?

Thanks in advance

score 2 · Accepted Answer · answered Dec 21 '20 at 04:47

2

It happens because the image size is applied in pixels, not percents. it means that the image is not resized along with the container and when the container has a small width the image goes beyond the chart. To solve that you should use percents for the image size and apply the align setting. For details, check the sample and pay attention to lines 17 and 19. Try to resize the chart view to see how it works.

answered Dec 21 '20 at 04:47

AnyChart Support

3,770
1
10
16

Hi, thank you. I'm gonna try it. I only have a question whats does line 19 do? `image.align('x-mid-y-mid');` – Marisol patito Dec 22 '20 at 19:34
It applies the image scaling. You can learn more about it at the following page - https://api.anychart.com/anychart.graphics.vector.Image.Align – AnyChart Support Dec 23 '20 at 04:54
This was the solution. Thank you so much – Marisol patito Jan 08 '21 at 19:10

Image in anychart doesn't fix the stage

1 Answers1