2014-09-19 1 views
1

Я использую mapbox.js для отображения карты. Я пытаюсь загрузить geojson с моего сервера, который содержит либо многоугольник страны, либо координаты города (lon, lat).стиль точки geojson как POI с лифтом/картами

Мне удалось смоделировать многоугольники страны, но не точки города/маркеры. Я не могу изменить в формате GeoJSON использовать MapBox simplestyle

Вот код выполняется при загрузке страницы (я изменил MapBox карту ID):

var southWest = L.latLng(-90, -360), northEast = L.latLng(90, 360); 
var bounds = L.latLngBounds(southWest, northEast); 

var map = L.mapbox.map('map', 'MapboxMapID', { zoomControl: false, infoControl: true, detectRetina: true, maxBounds: bounds, minZoom: 2, legendControl: {position: 'topright'}}); 

new L.Control.Zoom({ position: 'bottomright' }).addTo(map); 
map.fitBounds(bounds); 

var locationsGroup = L.featureGroup().addTo(map); 

, а затем, когда пользователь выбирает страну или город с переключателем:

$("#select2-search-up").on("change", function (e) { 
    if (e.added) { 
     var location = L.mapbox.featureLayer().loadURL('/citiesCountriesID/' + e.added.id).on('ready', function(featLayer) { 
      this.eachLayer(function(polygon) { 
       polygon.setStyle({ 
        stroke:false, fillColor:'red', fillOpacity:0.2 
       }); 
      }); 
     }); 
     locationsGroup.addLayer(location); 
    } else { 
     locationsGroup.eachLayer(function (layer) { 
      if (layer._geojson[0]._id == e.removed.id) { 
       locationsGroup.removeLayer(layer); 
      } 
     }); 
    } 
}); 

в идеале я хотел бы, чтобы отобразить другой значок, стандартный маркер, но я мог бы сделать с небольшим красным квадратом

Спасибо за ваши входы

ответ

0

В этом примере я сделал несколько маркеров круга, но я уверен, что вы можете делать другие базовые svg-shps или свои собственные .png довольно легко. http://bl.ocks.org/mpmckenna8/db2eef40314fe24e9177

В этом примере из Mapbox также показано, как использовать значок из своей библиотеки значков, в которой также есть много вариантов. https://www.mapbox.com/mapbox.js/example/v1.0.0/l-mapbox-marker/

Это также может помочь, чтобы увидеть некоторые из вашей структуры GeoJSON, чтобы понять, почему он не может использовать simplestyle

В моем примере bl.ocks я загрузил каждый из GeoJSON наборов данных отдельно

var begin = L.geoJson(start,{ 
    pointToLayer:function(feature, latlng){ 
     return L.circleMarker(latlng,{ 
     radius:9, 
     fillColor: "orange", 
     fillOpacity:.7 
     }) 
    } 
}) 

Я установил свои круги, и я установил другой L.geoJson для других данных, которые я оставил в качестве маркеров по умолчанию.

+1

Хотя эта ссылка может ответить на вопрос, лучше включить основные части ответа [здесь] (http://meta.stackoverflow.com/a/8259) и предоставить ссылку для справки. Ответные ссылки могут стать недействительными, если связанная страница изменится. – bummi

Смежные вопросы