Posted inTechnology / Ajax / JavaScript / jQuery

Google Charts Change tooltip position

Today, We want to share with you Google Charts Change tooltip position.In this post we will show you google scatter chart tooltip, hear for Timeline Google Chart with customized tooltip we will give you demo and example for implement.In this post, we will learn about google charts show tooltip by default with an example.

Google Charts Change tooltip position

There are the Following The simple About Google Charts Change tooltip position Full Information With Example and source code.

As I will cover this Post with live Working example to develop google chart disable tooltip, so the some HTML Tooltip Position in scatter chart for this example is following below.

Timeline Google Chart with customized tooltip

Change tooltip position on Google Charts

//How to change pop-up location of google charts tooltip
var chart = new google.visualization.LineChart();, 'ready', fixDataToolTipPosition);
chart.draw( cdata, options);

function fixDataToolTipPosition() {
    var container = $(' > div:last-child > div:last-child')[0];

    function dataTemplatePos(e) {
        var tooltip = $('.google-visualization-tooltip');
        var left = mouse.x - tooltip.width()/2;
        var top = mouse.y - tooltip.height() - 15;
        tooltip.css('left', left + 'px');
        tooltip.css('top', top + 'px');

    if (typeof MutationObserver === 'function') {
        var observer = new MutationObserver(function (m) {
        observer.observe(container, {
            childList: true
    } else if (document.addEventListener) {
        container.addEventListener('DOMNodeInserted', dataTemplatePos);
    } else {
        container.attachEvent('onDOMNodeInserted', dataTemplatePos);

Simple Example of the google visualization tooltip position

Angular 6 CRUD Operations Application Tutorials

Read :


You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Google Charts Change tooltip position.
I would like to have feedback on my blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

I am Jaydeep Gondaliya , a software engineer, the founder and the person running Pakainfo. I'm a full-stack developer, entrepreneur and owner of I live in India and I love to write tutorials and tips that can help to other artisan, a Passionate Blogger, who love to share the informative content on PHP, JavaScript, jQuery, Laravel, CodeIgniter, VueJS, AngularJS and Bootstrap from the early stage.

Leave a Reply

Your email address will not be published. Required fields are marked *

We accept paid guest Posting on our Site : Guest Post Chat with Us On Skype