14

使用谷歌图表 GeoChart:https ://google-developers.appspot.com/chart/interactive/docs/gallery/geochart

是否可以放大而不只是放大整个区域?也就是说,要达到地图的街景级别,并且仍然像上面链接上的标记示例中所示那样放置标记?

谢谢大家的帮助...

4

5 回答 5

15

API 不支持缩放、拖动或滚动。

于 2012-10-13T15:16:35.973 回答
5

作为一个技巧,我在容器上使用了带有溢出的 css 缩放属性:隐藏。但它应该在chart.draw() 之后在谷歌图表就绪事件上执行。

如果您需要重绘(我正在重绘窗口大小以保证响应性),您应该在再次绘制之前再次强制缩放到 1 或 100%。

HTML:

<div id="container" style="overflow:hidden; width:..px;">
     <div id="chart_div"></div>
</div>

JS(jQuery):

$("#chart_div").css("zoom",1);

// [... google chart code generation ...]

google.visualization.events.addListener(chart, 'ready', function() { $("#chart_div").css("zoom",1.4); });
chart_draw(data, options);

它对我有用,值得一试。

于 2015-10-26T15:35:22.613 回答
0

我遇到了同样的问题,而 GeoChart 在这方面被证明太有限了。

一种选择是使用谷歌地图和数据层。例如,如果您需要带有颜色和大小的标记,您可以执行以下页面上的示例(请参阅“高级样式”): https ://developers.google.com/maps/documentation/javascript/examples/layer -数据地震

您需要实现自己的插值来确定大小和颜色,但生成的地图/图表将比单独的 GeoChart 更好。

于 2014-10-31T17:55:32.987 回答
0

看起来 Google Charts 现在有一个名为“explorer”的过期选项,适用于某些图表类型。请参阅: https ://developers.google.com/chart/interactive/docs/gallery/linechart#Configuration_Options

于 2015-04-08T18:11:28.900 回答
0

您可以尝试在标记单击时生成选择事件,并且在事件函数中,您可以通过更改 chartOptions 来更改图表的区域,如下所示:

 google.visualization.events.addListener(chart, 'select', () => {
  // console.log(this.continents);
  if (continents.includes( continentData.getValue(chart.getSelection()[0].row, 2))) {
   chartOptions.region = '053';
   // 002 - Africa
   // 150 - Europe
   // 019 - Americas 021 - Northern America 005- South America 013- Central America 029 - Caribbean
   // 142 - Asia
   // 009 - Oceania
   // 053 - Australia and New Zealand

    chart.draw(continentData, chartOptions);
  }
});
于 2020-05-04T11:07:14.007 回答