Карта Choropleth, использующая буклет, не отображающий правильный стиль

1

Я создал карту выборов 2016 года на уровне графства, где, если одна партия получает больше голосов, чем другая в одном графстве, этот округ получает цвет этой партии. Поэтому, очевидно, я использую условное утверждение. Почти все округа выглядят прекрасно, они следуют правилу, но некоторые из них НЕ. Например, Gray County, TX, где дем только около 9%, в то время как гоп получил 88%. По какой-то причине карта отображает это графство синим цветом, а не цветной схемой:

Изображение 174551

Вы можете найти здесь карту: https://sushirittoman.github.io/maps/counties_project/index.html

И вот код, который я написал для карты, сильно заимствуя из учебника листка для карт choropleth (https://leafletjs.com/examples/choropleth/):

//Red palette for Gop 
function getColorGop(v) {
            return v > 70 ? '#800026' :
                   v > 50 ? '#BD0026' :
                   v > 40 ? '#E31A1C' :
                   v > 30 ? '#FC4E2A' :
                   v > 20 ? '#FD8D3C' :
                   v > 10 ? '#FEB24C' :
                            '#FED976' ;                                  

}

//Blue palette for Dems
function getColorDem(v) {
            return v > 70 ? '#08589e':
                   v > 50 ? '#2b8cbe':
                   v > 40 ? '#4eb3d3':
                   v > 30 ? '#7bccc4':
                   v > 20 ? '#a8ddb5':
                   v > 10 ? '#ccebc5':
                            '#e0f3db';                               

}

//Ultimate style, where we insert the conditional statement
function style(feature) {
            if ([feature.properties.per_dem * 100] > [feature.properties.per_gop * 100]) {
                return {
                    fillColor: getColorDem(feature.properties.per_dem * 100),
                    weight: 1,
                    opacity: 1,
                    color: 'black',                    
                    fillOpacity: 1                        
                }                                        
            } 
            else {
                return {
                    fillColor: getColorGop(feature.properties.per_gop * 100),
                    weight: 1,
                    opacity: 1,
                    color: 'black',                   
                    fillOpacity: 1                        
                };
}        

Я в тупике. Я надеялся, что это может быть моя первая официальная веб-карта без обучения. Этот вопрос кажется аномалией. Я бы очень признателен за ваши мысли.

Теги:
leaflet
mapping
choropleth
polygons

1 ответ

0

Ваше сравнение написано так:

[feature.properties.per_dem * 100] > [feature.properties.per_gop * 100]

[...] в Javascript является синтаксисом для объявления массива, а это значит, что вы пытаетесь определить, больше ли массив, чем другой, и, вероятно, не то, что вы хотите (учитывая, как работает листинг типов в JS, предсказывая результат может быть сложным).

Пытаться

if (feature.properties.per_dem * 100 > feature.properties.per_gop * 100)

или (+, чтобы отличить строки в вашем geoJSON в числах)

if (+feature.properties.per_dem > +feature.properties.per_gop)
  • 0
    Спасибо, сэр, ваш ответ исправил это.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню