HTML Tooltip not showing

[Patrike]

Hi : )

Can someone give me a light? Why the HTML Tooltip in this chat isn't coming?

http://jsfiddle.net/82hAT/

Thanks

[Patrike]

the exactly link is: http://jsfiddle.net/82hAT/2/

[asgallant]

You are setting the "tooltip" option twice in the chart's options, and the second time is overwriting the first.  You need to move the "html: true" to the second instance of the tooltip option (near the bottom): http://jsfiddle.net/asgallant/82hAT/3/

I also made a few other small changes:

1) I turned off the normalized CSS in the fiddle options (this is what was causing the text to overflow the tooltips)

2) I remove the lines:

var options = {

    tooltip: {isHtml: true}

};

as they don't do anything for you

3) I remove ", options" from the dashboard.draw call, as this has no effect.

[Patrike]

Thanks again for your help asgallant!

I am testing this feature... but I think I am missing something somewhere. I read the https://developers.google.com/chart/interactive/docs/customizing_tooltip_content but couldn't apply it to my chart the way i would.

I just wanna the tooltip to have the same information it has as if it was without html (than, after I will add some code)... can you or someone else give some more light on this?

this is the situation I am right now: http://jsfiddle.net/82hAT/4/

I don't understand why the first 2 lines isn't with my custom html...

thanks again for any info on this.

[asgallant]

Your tooltip is working fine, see the "Informativa" data series.  If you want the custom tooltips on the other columns, you have to add more tooltip columns, like this: http://jsfiddle.net/asgallant/82hAT/6/

[Patrike]

Thanks for the light asgallant!

Just one more thing related to the browser.... maybe you have faced this before...

After the tooltip switch to html the range bar move down 18 pixels when I hover a point in chart that brings the tooltip....I went in IE dev mode and found a div with "18" (the other div doesn't disturb me).

Question... there is a way to avoid it? the chart is shaking like pop corn heheheh

thanks.

I am running the chart in IE8 manly... i tested in firefox and it runs fine

[asgallant]

I can't replicate that issue in IE 8 using the code from my example.  Did you change anything, or are you using that code as is?

[Patrike]

I came just after the enable of html tooltip feature...
i just use this since the beginning:

                                    <div id="dashboard">
                                        <div id="chart_div" style="width: 100%;"></div>
                                        <div id="range_filter_div" style="width: 100%;"></div>
                                    </div>


it is a little bit annoying, but no problem... the help you gave me is 100%

[asgallant]

I looked closer at the screenshot of HTML you posted above, and I see those div's have closure_uid_###### attributes, which seems to imply the use of Google's closure javascript compiler somewhere in the process.  Are you using that on the js code?  I assume that the Google uses the closure compiler on the API code, but this is the first time I've seen any manifestation of closure outside the API source.

In any event, I doubt that those divs are responsible for the height change problem, as they are likely present throughout the whole process.  Inside the container div for the chart, the API is creating a div that holds the tooltip information.  Ideally, this div will be positioned properly over the chart, but it is possible that there is a CSS issue somewhere that is messing with the display of the div.

[Patrike]

I just went in the IE dev tools to see the generated code... weird case... well anyway... will take a look into it further... thanks again. Another question: There is a way to make the tooltip more near the mouse pointer? I have a link in the tooltip... when I move the mouse from the chart point to the tooltip, as it is TOO far from it the tooltip disapear... I have to move really fast to put the mouse inside the tooltip to click in the link.

thanks again :)

[asgallant]

There is nothing in the API to control the tooltip position.  You might have some luck playing with CSS, but I'm not optimistic.  You can make a feature request to add support for this here: http://code.google.com/p/google-visualization-api-issues/issues/list.

As an alternative to linking in the tooltip, you can use a "select" event listener on the chart to make the points on your lines act like links.

[Patrike]

thanks for the amazing support. just opened the ticket