谷歌可视化库加载创建两个不同的结果答案

【问题标题】：Google Visualization library loading creates two different results谷歌可视化库加载创建两个不同的结果
【发布时间】：2016-02-01 15:10:34
【问题描述】：

我在正确加载 Google 可视化库时遇到了一个非常令人沮丧的问题。我的页面上有两个图表。一个是柱状图，另一个是折线图。

我正在像这样加载我的库： google.load('visualization', '1.0', {'packages':['corechart'],'callback':drawcharts});

然后我像这样调用我的柱形图：

var chart = new google.visualization.ColumnChart(chartDiv)

我的折线图是这样的：

myLineChart = new google.visualization.LineChart(document.getElementById('myChart2'));

这会产生以下两个图表：

第一张图片是折线图，这就是问题所在。当我像这样加载我的可视化库时：

google.load('visualization', '1.0', {'packages':['linechart','columnchart'], 'callback': drawcharts});

我得到了我想要的折线图：

但是我的柱状图变成了这样：

我尝试调整柱状图上的 bar:groupwidth，但在柱状图上使用 Addlistener 事件时遇到问题。

如何加载所需的库，以便获得线图的 corechart 版本和正常的柱形图（不是带有 corechart 的那个）？基本上，图2和图3？ corechart.linechart 与仅加载 linechart 有何不同？

【问题讨论】：

请您分享演示事件问题的代码吗？
@WhiteHat 我的问题的核心是当使用“corechart”或“columnchart”加载柱状图时，鼠标悬停监听器是如何工作的。我使用 geocodezip 在此处找到的此代码：geocodezip.com/v3_elevation-profile_distance.html。在第 84 行，您可以看到他正在加载柱形图。当我加载 corechart 时，高程上的鼠标悬停不会一直走。我试着做一个小提琴，但我遇到了问题。

【解决方案1】：

真是个愚蠢的错误。我的图表 div 的宽度和图表选项中设置的宽度不一样。当我使它们相同时，它工作正常。

【讨论】：