Итак, я следую этому уроку: https://www.e-education.psu.edu/geog585/node/781 , Который предназначен для создания пропорциональной карты символов с помощью Leaflet.

Вот мой файл JSON: https://api.myjson.com/bins/ohhd8

Вот мой код:

function addCTHValue () {

            // function to size each icon proportionally based on CTH value

        function sizeByCTHValue(feature){
          var calculatedSize = (feature.properties.CTHValue / 3000) * 30;

          // create money icons

          return L.icon({
            iconUrl: 'money.png',
            iconSize: [calculatedSize, calculatedSize]
          });
        }

    var CTHValueLayer =                 L.geoJson(CTHValue, { 
                pointToLayer: function (feature, latlng) {
                return L.marker(latlng, {icon: sizeByCTHValue(feature)
                });
            }       
    });

    CTHValueLayer.addTo(map);
}

Прямо сейчас все мои значки абсолютно огромны, не центрированы по ширинным точкам в моем json, и я не могу понять, как правильно масштабировать значки.

Моя основная проблема заключается в следующей строке: (feature.properties.CTHValue / 3000) * 30; Эти цифры предназначены для обозначения того, что когда значение CTH равно 3000, его репрезентативный значок будет иметь ширину 30 пикселей. Кажется, это не работает, так как мои иконки намного больше, чем 30 пикселей, несмотря на то, что ни одно из моих значений CTH даже не достигает 3000.

Кроме того, я мог центрировать их в правильных точках с помощью якоря? Прямо сейчас они все толпятся в углу моей карты и перемещаются, когда я увеличиваю и уменьшаю масштаб.

Может кто-нибудь, пожалуйста, помогите мне исправить мою карту :-)

1
sophie