从KML提要获取坐标以与mapbox一起使用
Get coordinates from KML feed to use with mapbox
我正试图从我的foursquare feed中获得坐标,并在地图中使用它们以在网站上显示。主要是作为学习javascript和Mapbox的练习-我是新手。
我使用mapbox 'add single marker'代码和一些其他代码循环遍历我的KML以查找坐标,因为mapbox不接受KML。
不知怎么的,我不能让它工作。任何提示都非常感谢!
<!-- Foursquare map -->
<script>
// get coordinates and place from Foursquare feed
$(document).ready(function(){
$.get("https://feeds.foursquare.com/history/6a46a109e06aa6d74d34b42b397806d5.kml?count=1", function(data){
$(data).find("Placemark").each(function(index, value){
coords = $(this).find("coordinates").text();
place = $(this).find("name").text();
pos = coords.split(",")
var features = [{
"geometry": { "type": "Point", "coordinates": pos[0], pos[1]},
"properties": { "place": place }
}];
});
});
});
// start Mapbox
var map = mapbox.map('map-canvas').zoom(5).center({
lat: 0,
lon: 0
});
map.addLayer(mapbox.layer().id('rikwuts.map-0i5jiwdn'));
// Create an empty markers layer
var markerLayer = mapbox.markers.layer().features(features);
// Add interaction to this marker layer. This
// binds tooltips to each marker that has title
// and description defined.
mapbox.markers.interaction(markerLayer);
map.addLayer(markerLayer);
// Add a single feature to the markers layer.
// You can use .features() to add multiple features.
markerLayer.add_feature({
geometry: {
// The order of coordinates here is lon, lat. This is because
// we use the GeoJSON specification for all marker features.
// (lon, lat is also the internal order of KML and other geographic formats)
coordinates: [ pos.lng, pos.lat ]
},
properties: {
// these properties customize the look of the marker
// see the simplestyle-spec for a full reference:
// https://github.com/mapbox/simplestyle-spec
'marker-color': '#00ff00',
'marker-symbol': 'star-stroked',
title: place,
description: 'This is a single marker.'
}
});
// Attribute map
map.ui.attribution.add()
.content('<a href="http://mapbox.com/about/maps">Thanks to Mapbox</a>');
</script>
<div id="map-canvas"></div>
<!-- END map -->
您可以使用getojson将KML转换为MapBox.js的GeoJSON
相关文章:
- 转义符不能与innerHTML一起使用
- 高亮显示与数组字符串一起使用时文本插件中断
- setTimeout可以与闭包内的函数一起使用吗
- 将依赖外部库的UMD模块与browserfy捆绑在一起
- Highcharts colorsByPoint与系列中的线性渐变一起使用时不起作用
- 如何将js库与typescript一起使用
- 将webpack和babel与父项目目录中的文件一起使用
- 将 Drag&Drop 与 jsTree 和 DataTables 一起使用
- Javascript-如何让脚本与Ajax请求的数据一起运行
- 将两个ext.TabPanels滚动到一起
- 将jQuery UI Timepicker Addon与React一起使用
- 什么是curl以及如何将其与nodejs一起使用
- Javascript”;onmousemove”;事件无法与类一起使用
- 将require('..')与变量一起使用与在webpack中使用字符串相比
- 嵌入式GeoJSON样式与Mapbox GL一起使用吗
- 如何将MapBox地图与Mapquest路线服务一起使用
- jQuery循环将多个数组组合在一起-Mapbox-map.setFilter()
- 从KML提要获取坐标以与mapbox一起使用
- mapbox不能与另一个.geojson文件一起工作的例子
- mapbox infoControl导致'undefined不是函数'与.addInfo方法一起使用时出