Диаграммы Google: изменить цвет области при нажатии

Question

Я работаю над картой с помощью Google Chart.

Когда кто-то нажимает на область, каждый регион меняет непрозрачность, а щелчок сохраняет исходный цвет.

Это так же, как это, но для регионов: https://developers.google.com/chart/interactive/docs/gallery/columnchart#creating-material-column-charts

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

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

Answer 1

с помощью опции colorAxis конфигурации,
назначить большее число для выбранного региона
сбросить оставшиеся регионы обратно в ноль

см следующий рабочий фрагмент кода ...

google.charts.load('current', { 
 
    callback: function() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
     ['Country', 'Popularity'], 
 
     ['England', 0], 
 
     ['Wales', 0], 
 
     ['Scotland', 0], 
 
     ['Ireland', 0], 
 
    ]); 
 

 
    var options = { 
 
     colorAxis: { 
 
     minValue: 0, 
 
     colors: ['#FFEBEE', '#B71C1C'] 
 
     }, 
 
     region: 'GB', 
 
     resolution: 'provinces' 
 
    }; 
 

 
    var chart = new google.visualization.GeoChart(document.getElementById('chart_div')); 
 

 
    google.visualization.events.addListener(chart, 'select', function() { 
 
     for (var i = 0; i < data.getNumberOfRows(); i++) { 
 
     if (i === chart.getSelection()[0].row) { 
 
      data.setValue(i, 1, 100); 
 
     } else { 
 
      data.setValue(i, 1, 0); 
 
     } 
 
     } 
 
     chart.draw(data, options); 
 
    }); 
 

 
    chart.draw(data, options); 
 
    }, 
 
    packages:['geochart'] 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<script src="https://www.google.com/jsapi"></script> 
 
<div id="chart_div"></div>