嘿伙计我试图隐藏图例工具提示并仅保存国家/地区名称或隐藏所有工具提示但不成功。请帮忙。比我使用的代码更多:
<div>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["geomap"]});
google.setOnLoadCallback(drawMap);
function drawMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'ATI'],
['Portugal', 1],
['Brazil', 7],
['Peru', 9],
['Argentina', 3],
['Spain', 3],
['Mexico', 3],
['Venezuela', 7],
['Ecuador', 4],
['Chile', 6],
['Colombia', 3],
['Costa Rica', 4],
]);
var options = {};
options['dataMode'] = 'regions';
options['region'] = 'world';
options['showLegend'] = false;
options['width'] = '100%';
options['tooltip.trigger'] = 'none';
options['tooltip'] = {textStyle: {color: '#FFF'}, showColorCode: false};
options['tooltip.textStyle'] = {color: 'white'};
options['height'] = '600px';
options['colors'] = [0xf9ffed, 0xff0943, 0x50eb1f, 0xeab4d2];
var container = document.getElementById('regions_div');
var geomap = new google.visualization.GeoMap(container);
geomap.draw(data, options);
};
</script>
<div align="center" id="regions_div" style="width: auto; height: auto;"></div>
</div>
因此,我看到了一张地图,但附有图例编号。我不知道如何隐藏它们。
答案 0 :(得分:1)
GeoMap(google.visualization.GeoMap
)是基于 Flash 的控件,不支持为其配置工具提示可见性,而GeoChart(google.visualization.GeoChart
)是基于SVG的控件,其中turn替换GeoMap控件和supports more options for customizing it,特别是隐藏工具提示的能力。
说过我建议用GeoChart替换GeoMap,如下所示。
示例强>
google.load('visualization', '1', { 'packages': ['geochart'] });
google.setOnLoadCallback(drawMap);
function drawMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'ATI'],
['Portugal', 1],
['Brazil', 7],
['Peru', 9],
['Argentina', 3],
['Spain', 3],
['Mexico', 3],
['Venezuela', 7],
['Ecuador', 4],
['Chile', 6],
['Colombia', 3],
['Costa Rica', 4],
]);
var options = {};
options['colorAxis'] = { colors: ['#f9ffed', '#ff0943', '#50eb1f', '#eab4d2'] };
options['tooltip'] = { trigger: 'none' };
options['legend'] = 'none';
options['displayMode'] = 'regions';
options['width'] = '100%';
options['height'] = '600px';
var container = document.getElementById('regions_div');
var geomap = new google.visualization.GeoChart(container);
geomap.draw(data, options);
};
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<div align="center" id="regions_div" style="width: auto; height: auto;"></div>