2016-11-19 2 views
2

Я пытаюсь создать карту памяти хлороплетов в HighMaps, используя пользовательские файлы geojson.Добавление Maplines в HighMaps с использованием файла geojson

У меня есть два файла geojson - первый содержит данные уровня графства, а второй содержит меньшие районы города, которые содержатся в округах.

Я пытаюсь добавить границы уровня округов в мою chloropleth карты аналогична этот пример: http://www.highcharts.com/maps/demo/us-counties

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

Мой код расслоения плотного ниже:

$(function() { 

    $.getJSON('population.json', function(data) { 

    $.getJSON('smaller_areas.geojson', function(geojson) { 

    $.getJSON('counties.geojson', function(maplines){ 


    // Initiate the chart 
    Highcharts.mapChart('container', { 
    chart: { 

        width: 600, 
       borderWidth: 1 
      }, 

    title: { 
     text: 'Population' 
    }, 

    legend: { 

       title: { 
        text: 'Crime Rates', 
        style: { 
         color: (Highcharts.theme && Highcharts.theme.textColor) || 'black' 
        } 
       }, 
       align: 'right', 
       verticalAlign: 'top', 
       floating: true, 
       layout: 'vertical', 
       valueDecimals: 0, 
       backgroundColor: (Highcharts.theme && Highcharts.theme.legendBackgroundColor) || 'rgba(255, 255, 255, 0.85)', 
       symbolRadius: 0, 
       symbolHeight: 14 
      }, 

     mapNavigation: { 
     enabled: true, 
     enableDoubleClickZoomTo: true 
     }, 

     colorAxis: { 
      min: 1, 
      type: 'logarithmic', 
      minColor: '#EEEEFF', 
      maxColor: '#000022', 
      stops: [ 
       [0, '#EFEFFF'], 
       [0.67, '#4444FF'], 
       [1, '#000022'] 
      ] 
     }, 

     series: [{ 
     data: data, 
     mapData: geojson, 
     joinBy: ['GEOGID', 'GEOGID'], 
     name: 'Population', 
     tooltip: { 
      pointFormat: '{point.Name}: {point.value}' 
     } 
     }, 
     { 
       type: 'mapline', 
       name: 'County Borders', 
       Data: maplines, 
       color: 'black', 
       lineWidth: 10 
      }] 
     }); 
     }); 
    }); 
    }); 
}); 

Я предполагаю, что мне нужно будет изменить команду «данных» для серии maplines из-за того, что я читаю из файла GeoJSON; однако я не уверен, как это сделать.

Мой GeoJSON для данных графства выглядит следующим образом: { "типа": "FeatureCollection", "СВК": { "типа": "имя", "свойства": { "имя" «урну: ogc: def: crs: EPSG :: 3857 "}}, " features ": [ {" type ":" Feature "," properties ": {" COUNTYNAME ":" Leitrim "}," geometry ": {" тип ":« MultiPolygon »,« координаты »: [[[[-925332.1353, 7260461.4174], [-925231.9477, 7260212.372], [-925020.4407, 7260020.804], [-924719.8781, 7259925.0218], [-924597.4266, 7259886.7092],

, за которым следуют остальные прогнозы для этого округа и последующих округов.

Может ли кто-нибудь помочь?

Заранее спасибо.

+0

Данные должны начинаться с небольшой буквы. Можете ли вы воссоздать проблему на jsfiddle/codepen/etc.? Вы можете вставить json contect, чтобы он не использовал вызов ajax. – morganfree

ответ

1

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

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