Карты High-Chart показывают некоторые выбранные состояния с возможностью выбора других состояний. - PullRequest
0 голосов
/ 31 мая 2019

Я хочу показать карту старшего уровня со всеми штатами США, и я вышлю список нескольких штатов, и эти штаты должны быть выбраны.Если пользователь хочет выбрать дополнительные состояния, он может щелкнуть и выбрать их.Я понятия не имею, как поступить.

Я попытался передать данные о состоянии, которые должны отображаться как выбранные.Он отображается как выбранный, но я не могу выбрать другие состояния.

this.Data = [{"StateAbbr": "AZ", "StateName":"Arizona"},
               {"StateAbbr": "FL", "StateName":"Florida"}];


            this.chartOptions = function () {
                return {
                    chart: { renderTo: 'geographySection', borderWidth: 0 
                     },                        
                    mapNavigation: { enabled: false },
                    series: this.series(),
                    credits: { enabled: false }                      
                };
            };

            this.series = function () {
                return [{
                    animation: { duration: 1000 },
                    showInLegend: false,
                    data: this.Data,
                    mapData: Highcharts.maps['countries/us/us-all'],
                    joinBy: ['postal-code', 'StateAbbr'],
                    dataLabels: { enabled: true, format: '{point.StateAbbr}' },
                    tooltip: {  headerFormat: '', pointFormat: '{point.StateName}' }

                }];
            };

            new Highcharts.Map(this.chartOptions());

1 Ответ

1 голос
/ 03 июня 2019

Вы можете добавить к своим данным selected свойство, например, с помощью опции keys:

var data = [
    ['us-ma', 0],
    ['us-wa', 1, true],
    ['us-ca', 2, true],
    ['us-or', 3],
    ['us-wi', 4],
    ...
];

// Create the chart
Highcharts.mapChart('container', {
    ...,

    series: [{
        keys: ['hc-key', 'value', 'selected'],
        data: data,
        ...
    }, ...]
});

Демонстрационная версия: http://jsfiddle.net/BlackLabel/2ag6woe4/

Справочник по API: https://api.highcharts.com/highmaps/series.mappoint.keys

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...