我对 fusion table 和 google-maps API 很陌生。我正在研究 Microsoft 提供的出租车数据集。
数据格式的类型
taxi_id, timestamp, longitude, latitude
这些数据是由北京大约 10000 辆出租车在 6 天内收集的。有代表每辆出租车数据的单独文件。作为试运行,我刚刚将出租车文件导入到谷歌融合表中。我的想法是,以北京的纬度经度为中心,并提供一个适当的半径,我画一个圆圈并将该圆圈中的所有点都吞没。
由于我需要绘制只有纬度和经度但没有地址的圆和吞没点(ST_INTERSECT 将地址作为我相信的参数之一),我在谷歌群组中浏览了一下,我可以确定我需要开发 KML对于文件,而不是直接上传文本文件。所以我开发了一个 KML,在其中,我在“Point”标签中包含了经度和纬度。
所以我的融合表包括,
timestamp id col2 #col2 is a point type consisting of long, lat pair
我可以玩弄一下,然后编写一个 javascript 来绘制一个圆圈并在其中吞没点。脚本如下。
<!DOCTYPE html>
<html>
<head>
<title>csv2kml - Google Fusion Tables</title>
<style type="text/css">
html, body, #googft-mapCanvas {
height: 500px;
margin: 0;
padding: 0;
width: 600px;
}
#googft-legend{background-color:#fff;border:1px solid #000;font-family:Arial, sans- serif;font-size:12px;margin:5px;padding:10px 10px 8px;}#googft-legend p{font-weight:bold;margin-top:0;}#googft-legend div{margin-bottom:5px;}.googft-legend-swatch{border:1px solid;float:left;height:12px;margin-right:8px;width:20px;}.googft-legend-range{margin-left:0;}.googft-dot-icon{margin-right:8px;}.googft-paddle-icon{height:24px;left:-8px;margin-right:-8px;position:relative;vertical-align:middle;width:24px;}.googft-legend-source{margin-bottom:0;margin-top:8px;}.googft-legend-source a{color:#666;font-size:11px;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script>
<script type="text/javascript">
function initialize() {
map = new google.maps.Map(document.getElementById('googft-mapCanvas'), {
center: new google.maps.LatLng(39.9100, 116.4000),
zoom: 14,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
layer = new google.maps.FusionTablesLayer({
map: map,
heatmap: { enabled: false },
query: {
select: "col2",
from: "1D_ZXsYLX20yvYZHBB20_VmSi5haJA5Q65kNML1M",
where: "ST_INTERSECTS(col2, CIRCLE(LATLNG(39.9100, 116.4000), 500))"
},
options: {
styleId: 2,
templateId: 2
}
});
//var lay=layer;
layer.setMap(map);
// Create a map circle object to visually show the radius.
var circle = new google.maps.Circle({
center: new google.maps.LatLng(39.9100, 116.4000),
radius: 500,
map: map,
fillOpacity: 0.2,
strokeOpacity: 0.5,
strokeWeight: 1
});
// Update the radius when the user makes a selection.
google.maps.event.addDomListener(document.getElementById('radius'),
'change', function() {
var meters = parseInt(this.value, 10);
layer.setOptions({
query: {
select: 'col2',
from: "1D_ZXsYLX20yvYZHBB20_VmSi5haJA5Q65kNML1M",
where: 'ST_INTERSECTS(col2, ' +
'CIRCLE(LATLNG(39.9100, 116.4000), ' + meters + '))'
}
});
circle.setRadius(meters);
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="googft-mapCanvas"></div>
<select id="radius">
<option value="500">500 meters</option>
<option value="1000">1000 meters</option>
<option value="1500">1500 meters</option>
<option value="2000">2000 meters</option>
<option value="2500">2500 meters</option>
</select>
</body>
</html>
现在,我想在网页上的那个圆圈中打印点的 ID。请注意,圆的半径会不断变化,因为我已经给出了一个下拉菜单,这意味着我要显示的文本也会发生变化。我该怎么做呢?现在,我已经在融合表中导入了一个出租车文件,因此 id 在整个融合表中保持不变。但我将对几个出租车文件进行一些处理,这可能会导致表格合并,因此 id 会有所不同。现在我如何检索该圆圈中的出租车的 ID 并将其显示在网页上?
欢迎任何建议/帮助
谢谢 :)