Search code examples
chartshovercursorgoogle-visualizationoffset

Google charts: hovering offset

I'm using a Google Charts line chart but the hovering behavior is strange. It consistently highlights points that are slightly to the right of the cursor (see screenshot). Does anyone know what could cause this?

Hovering offset

Solution

  • The problem was caused by the div used for displaying the chart having a bootstrap col-class. Moving it to a new div solved it.

    Before:

    <div class="row">
    <div class="col-sm-12 m-t" id="chart_div">Loading chart</div>
</div>

    After:

    <div class="row">
    <div class="col-sm-12 m-t-xs">
        <div id="chart_div">Loading chart</div>
    </div>
</div>