谷歌可视化地图选择事件不启动
Google Visualization Map select event not firing
下面是绘制地图的代码:
options = {
mapType: 'styledMap',
zoomLevel: '2',
showTip: true,
useMapTypeControl: true,
maps: {
// Your custom mapTypeId holding custom map styles.
styledMap: {
name: 'Styled Map', // This name will be displayed in the map type control.
styles: [
{
featureType: 'poi.attraction',
stylers: [{ color: '#fce8b2' }]
},
{
featureType: 'road.highway',
stylers: [{ hue: '#0277bd' }, { saturation: -50 }]
},
{
featureType: 'road.highway',
elementType: 'labels.icon',
stylers: [{ hue: '#000' }, { saturation: 100 }, { lightness: 50 }]
},
{
featureType: 'landscape',
stylers: [{ hue: '#259b24' }, { saturation: 10 }, { lightness: -22 }]
}
]
}
}
};
var map = new google.visualization.Map(document.getElementById("div1"));
map.draw(data, options);
// code for handler
google.visualization.events.addListener(map, 'select', LocationsClick);
function LocationsClick() {
// Custom Code....
}
}
但是,当我单击映射中的指针时,不会引发事件,也不会调用我的函数。我在这里错过了什么?
在绘制映射之前,请尝试设置事件侦听器。
google.load('visualization', '1', { 'packages': ['map'] });
google.setOnLoadCallback(drawMap);
function drawMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'Population'],
['China', 'China: 1,363,800,000'],
['India', 'India: 1,242,620,000'],
['US', 'US: 317,842,000'],
['Indonesia', 'Indonesia: 247,424,598'],
['Brazil', 'Brazil: 201,032,714'],
['Pakistan', 'Pakistan: 186,134,000'],
['Nigeria', 'Nigeria: 173,615,000'],
['Bangladesh', 'Bangladesh: 152,518,015'],
['Russia', 'Russia: 146,019,512'],
['Japan', 'Japan: 127,120,000']
]);
var options = {
mapType: 'styledMap',
zoomLevel: '2',
showTip: true,
useMapTypeControl: true,
maps: {
// Your custom mapTypeId holding custom map styles.
styledMap: {
name: 'Styled Map', // This name will be displayed in the map type control.
styles: [
{
featureType: 'poi.attraction',
stylers: [{ color: '#fce8b2' }]
},
{
featureType: 'road.highway',
stylers: [{ hue: '#0277bd' }, { saturation: -50 }]
},
{
featureType: 'road.highway',
elementType: 'labels.icon',
stylers: [{ hue: '#000' }, { saturation: 100 }, { lightness: 50 }]
},
{
featureType: 'landscape',
stylers: [{ hue: '#259b24' }, { saturation: 10 }, { lightness: -22 }]
}
]
}
}
};
var map = new google.visualization.Map(document.getElementById("div1"));
google.visualization.events.addListener(map, 'select', selectHandler);
map.draw(data, options);
function selectHandler() {
document.getElementById("div2").innerHTML = JSON.stringify(map.getSelection());
}
};
<script src="https://www.google.com/jsapi"></script>
<div id="div1"></div>
<br/>
<div id="div2"></div>
相关文章:
- 从控制器返回后Ajax启动事件激发
- 触摸启动事件未在iframe iOS 6中启动
- preventDefault之后的重新启动事件
- 如何获取在一系列事件中启动事件的元素
- 当窗口打开时,IE9在加载前启动事件
- 我的 JS 代码中的会话启动事件
- 仅当前一个事件完全完成时,才启动事件
- jQuery UI - 如何区分拖动/调整大小启动事件和单击事件
- Javascript “卡住”键(未注册的键启动事件)
- pace.js:“启动”事件未触发
- 在第一次触摸启动事件时禁用所有点击事件是个好主意吗?
- 如何将“拖动启动”事件与 CKEditor 实例分离
- 触摸启动事件上的Javascript触发函数
- 绑定到触摸启动事件,导致自动对焦集中在Mobile Safari中的任何单击上
- 触摸启动事件未在原来隐藏的按钮上工作
- 有没有一种方法可以使触摸启动事件不会触发点击事件
- 检测浏览器窗口是否处于活动状态,并在窗口再次处于活动状态后启动事件[JavaScript]
- 如何检测浏览器是否支持手势启动事件
- 首先启动事件,然后转到url
- 在IE7中无法捕获鼠标启动事件