Google maps 如何使用javascript显示KML文件
如何使用javascript显示google earth KML文件Google maps 如何使用javascript显示KML文件,google-maps,Google Maps,如何使用javascript显示google earth KML文件 谢谢我假设您想在浏览器中查看KML文件,最好是Mozilla Firefox。首先,我想给出一些我们将在OpenLayers中使用的简单JavaScript。您应该尝试一下,因为它也使用JavaScript库 在这里,我简要地向您展示代码是如何编写的 <html> <head> <title>Google Layer with KML file</title> <link
谢谢我假设您想在浏览器中查看KML文件,最好是Mozilla Firefox。首先,我想给出一些我们将在OpenLayers中使用的简单JavaScript。您应该尝试一下,因为它也使用JavaScript库 在这里,我简要地向您展示代码是如何编写的
<html>
<head>
<title>Google Layer with KML file</title>
<link rel="stylesheet" href="http://openlayers.org/api/theme/default/style.css" type="text/css" />
<link rel="stylesheet" href="http://openlayers.org/dev/examples/style.css" type="text/css" />
<script src='http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAl9RMqSzhPUXAfeBCXOussRTQDbvAygy0cfGJr8dEMAYKf3RWNBQqP9mjKIsqTfmAlz5LOJ3Xpy5s4w'></script>
<script src="http://openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript">
var map;
function init() {
// Create the map object
map = new OpenLayers.Map('map');
// Create a Google layer
var gmap = new OpenLayers.Layer.Google(
"Google Streets", // the default
{numZoomLevels: 20}
);
// Add layer to map
map.addLayer(gmap);
//Adding KML file to map
map.addLayer(new OpenLayers.Layer.GML("KML", "kompleks_antarabangsa.kml",
{
format: OpenLayers.Format.KML,
formatOptions: {
extractStyles: true,
extractAttributes: true,
maxDepth: 2
}
}));
// Zoom to Kuala Lumpur, Malaysia
map.setCenter(new OpenLayers.LonLat(101.686855,3.139003), 13);
}
</script>
</head>
<body onload="init()">
<h1 id="title">Google Layer with KML file</h1>
<div id="map" style='width: 700px; height: 700px'></div>
</body>
</html>
如你所见,地图上有一个橙色的小点。这是谷歌地图上加载的KML文件
尝试使用任何软件运行HTML代码。但是,我建议您使用记事本++。最后但并非最不重要的一点,我希望我的回答对你来说不会太晚,凯蒂
//KML文件是我的。所以,记住使用你的。谢谢。至少,你应该说点什么。不是我希望谢谢你。这会从…加载KML文件吗。。呃。。你的硬盘?您可以将其作为内存中的字符串提供吗?对一些wesbite做一个AJAX调用。。它返回KML数据。。然后进入一个javascript变量。。然后这些数据被渲染到谷歌地图上?我创建了一个工具,可以做到这一点:-你可以在这里找到源代码:嗨,这里:这可能会解决OP的问题,但如果它也解释了它为什么会解决OP的问题,那将更有帮助。当答案包括工作代码和解释代码工作的原因/是正确的解决方案时,通常会更好:
//do axis call to the data url
// parse the records to get the point and additional data
//plot like this
var features_1 = new Array(records.length -1);
for (var i = 1; i < records.length; i++) {
var coordinates = transform([ records[i][9], records[i][8]], 'EPSG:4326', 'EPSG:3857');
features_1[i-1] = new Feature( {
geometry: new Point(coordinates ),
name: records[i][6],
Magnitude: dat[i][dat[0].length -1],
size : dat[i][dat[0].length -1]
}) ;
}
var source = new VectorSource({
features: features_1
});
var clusterSource = new Cluster({
distance: 30,
source: source
});
vector = new VectorLayer({
source: clusterSource,
style: styleFunction
});
var raster = new TileLayer({
source: new Stamen({
layer: 'toner'
})
});
var map = new Map({
layers: [raster, vector],
interactions: defaultInteractions().extend([new Select({
condition: function(evt) {
return evt.type == 'pointermove' ||
evt.type == 'singleclick';
},
style: selectStyleFunction
})]),
target: 'map',
view: new View({
center: [0, 0],
zoom: 2
})
});