javascript - 带有 html 工具提示的 Google LineChart HTML 标签

Question

我在我的项目中使用谷歌折线图，我在自定义工具提示方面遇到了一些问题。

解决这个问题:http://jsfiddle.net/nq7sk6mq/7/

我想使用 HTML 工具提示，我的图表设置是:

if google
  google.load "visualization", "1.0",
    packages: ["corechart"]
    callback: ->
      data = new google.visualization.DataTable()
      data.addColumn('number', ' v1')
      data.addColumn('number', 'v2')
      data.addColumn({type:'boolean',role:'certainty'})
      data.addColumn('number', 'v3')
      data.addColumn({type:'boolean',role:'certainty'})
      data.addColumn('number', 'v4')
      data.addColumn({type:'boolean',role:'certainty'})
      data.addColumn({type: 'string', role: 'tooltip','p':{'html': 'true'}})

我的数据:

values.push [
          iterator, 
          values2[iterator],
          true, 
          values3[iterator], 
          true, 
          values4[iterator], 
          false,
          customTooltip()]

选项:

options = {
        legend:{position:"top"},
        vAxes: {
          0: {},
        },
        hAxis: {
          ticks: data.getDistinctValues(0)
        },
        series:{
          0: {pointSize: 5, color: "#0f8d4c"},
          1: {pointSize: 5, color: "#b74848"},
          2: {color: "#00a259", pointSize: 4}
        },

        width : width,
        tooltip: {isHtml: true}
      }

调用抽奖:

google.setOnLoadCallback(drawChart(values,chartid,options))
drawChart: (data, chartid,options) ->
  chart = new google.visualization.LineChart(document.getElementById(chartid));
  chart.draw(data,options)

自定义工具提示:

customTooltip: () ->
return '<div style="padding:5px 5px 5px 5px; height:20px;">' +
  "<p>Teeest</p>"+
'</div>'

然后我进入 Chrome:

<div>
  <undefined class="google-visualization-tooltip" style="width: 66px; height: 20px; left: 181.5px; top: 133.5px;">
    <div style="padding:5px 5px 5px 5px; height:20px;">
      <p>Teeest</p>
    </div>
  </undefined>
</div>

图表显示正确，如果使用普通工具提示，它们也能正常工作。所以我的问题是为什么我会得到这个破坏工具提示布局的未定义标签？

我发现不止我一个人遇到了这个问题。 http://code.google.com/p/google-visualization-api-issues/issues/detail?id=1290

Answer 1

根据@juvian 的帮助问题是样式是在 div cointainer 上内联设置的，并且工具提示似乎是从 div 继承的。所以答案是从 div 容器中删除样式并将其应用于所需的元素。