Control of Guide balloons are limited

[julianljk]

https://docs.amcharts.com/3/javascriptcharts/Guide

In the guide API, the balloon is going off the bounds of the chart and gets cut off, and there aren't properties in the guide API to fully control the balloon's properties.

Also, I can't seem to properly format the balloonText string property. It doesn't respect '\n' characters in the text

[martynasma]

To add a line break in a guide's balloon use the <br> tag. I.e.:

"balloonText": "First line.<br />Second line."

As for balloon going out of the area, you might try disabling fixed balloon position:

"balloon": {
  "fixedPosition": false
}

I hope this helps.

[Egoryk]

Agree julianljk. Very few features to control the display of balloon on the chart. And there is also a crawling graph balloon and guides balloon . Why there is no single mechanism of control?

P.S. I can give examples of problems with the balloon guide

[zontafil]

@martynasma afaik it's not possible to set the "balloon" object in a Guide object

[martynasma]

It is possible. However, it's pretty difficult to roll over the thin line.

To make easier to roll over set both value and toValue (or date/toDate or category/toCategory) to the same value.

Making it thicker (lineThickness) will also help.

[zontafil]

@martynasma it's not possible when you want a guide between 2 values. Using thickness is hard since it is necessary to compute the thickness dinamically for every zoom setting etc.

[martynasma]

Do you mean when you have a guide spanning categories/values?

That should work perfectly. Just make sure you set above: true for the guide so it is not obstructed by any other objects.

https://codepen.io/team/amcharts/pen/bc1facbf937738eadfa659436f680c34/

[Egoryk]

Your example gives an error when changing multiple json data values

[martynasma]

Well, guide balloons and chart cursor balloons are not checked against overlapping over each other. I guess there's no way around it. Sorry.