Отображение свойств вложенного GeoJson в Mapbox - PullRequest
0 голосов
/ 17 октября 2018

Я не могу запросить функцию вложенных свойств, которая импортируется из источника геоджон и отображается на карте mapbox.

Я могу получить эту функцию с помощью прослушивателя по щелчку, но как толькосвойство является вложенным, объект представляется в виде строки

{
 ...
  properties: {
   address: "{"place":"Bern","street":"Fischerweg","street_nr":"11","zip":"3012"}"
   price: 4500
 }
}

. Поэтому я могу отображать не вложенные свойства только во всплывающем окне, когда оно щелкается.

мой код:

const features = this.queryRenderedFeatures(e.point, {
        layers: ['unclustered-point']
      });

console.log(feature.properties.price) --> 4500
console.log(feature.properties.address) --> string instead of object {"place":"Bern","street":"Fischerweg","street_nr":"11","zip":"3012"}
console.log(feature.properties.address.street) --> undefined (--> NOT WORKING because of nested property)


const popup = new mapboxgl.Popup({offset: [0, -15]})
   .setLngLat(feature.geometry.coordinates)
   .setHTML('<h3>Price: ' + feature.properties.price + '</h3>
                  <p>Street: ' + feature.properties.address.street + '</p>')--> NOT WORKING because of nested property
   .setLngLat(feature.geometry.coordinates)
   .addTo(map);

Я читал, что вы можете получить доступ к вложенным свойствам с помощью выражений, но как выражения можно применить в HTML всплывающего окна?Есть ли способ, как я могу получить доступ к вложенным свойствам или мне нужно изменить структуру геоджона?

любая помощь высоко ценится!Большое спасибо,

С уважением, Саймон

1 Ответ

0 голосов
/ 18 октября 2018

Поскольку значения свойств преобразуются в строки JSON, необходимо обратное преобразование:

Object.keys(feature.properties).forEach(function(key) {
  feature.properties[key] = JSON.parse(feature.properties[key]);
});

[https://jsfiddle.net/s1d7hL82/]

...