Google Charts inside JQuery Dialog - tooltip

[vce....@gmail.com]

I use Google Charts to show line charts inside JQuery Dialog this way:

<script src="https://www.gstatic.com/charts/loader.js"></script>
<script>google.charts.load('current', {'packages':['line','corechart'],'language':'ru'});

Making the dialog:

$(document).ready(function(){
    //goodsItemsBind();
    $('#statDlg').dialog({
        autoOpen: false,
        width: 'auto',
        minHeight: '300px',
        dialogClass: 'statDlg',
        draggable: false,
        resizable: false,
        clickOutside: true,
    });
});

Drawing the chart:

 google.charts.setOnLoadCallback(drawChart);

  function drawChart() {

  var chartDiv = document.getElementById('statDlg');

  var data = new google.visualization.DataTable();
  data.addColumn('date', 'Дата');
  data.addColumn('number', 'Просмотры');
  data.addColumn('number', 'Переходы');

    data.addRows([
        [new Date(2016,3,19),  0,  0],
    ]);

    data.addRows([
        [new Date(2016,3,20),  0,  0],
    ]);


  var classicOptions = {
    title: 'Статистика просмотров и переходов',
    width: 800,
    height: 300,
    // Gives each series an axis that matches the vAxes number below.
    series: {
      0: {targetAxisIndex: 0},
      1: {targetAxisIndex: 1}
    },
    vAxes: {
      // Adds titles to each axis.
      0: {title: 'Просмотры'},
      1: {title: 'Переходы'}
    },
    hAxis: {
      ticks: [new Date(2016,3,19),new Date(2016,3,20)
      ],
      format: 'dd-е'
    },
    vAxis: {
      viewWindow: {
        max: 3
      }
    },
    legend: 'bottom',
    curveType: "function",
  };

  function drawClassicChart() {
    var classicChart = new google.visualization.LineChart(chartDiv);
    classicChart.draw(data, classicOptions);
  }

  drawClassicChart();

}
</script>

The result is ok, but one problem is that the tooltips doesnt shows while mouseover right on the points. They are showing while mouseover some pixels left and top from the point. You can see it on the image. I found out that it is because of the dialog, but I dont know how to solve it. Hovering to see tooltip

[Daniel LaLiberte]

I would guess that the problem with the position of the tooltip involves the css for your chart container element.  I'd need to experiment to find out what happens, but if you can nest the container element in another, and do your positioning there, that could help.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To post to this group, send email to google-visua...@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/a33a5ac2-fab8-4dd5-a24d-b73a679e8aaf%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Daniel LaLiberte

dlaliberte@Google.com   5CC, Cambridge MA