Geochart 地圖更改顏色

Question

我可以找到每個 backgroundColor、colorAxis、datalessRegionColor 等的配置名稱。但我只想更改綠色的默認顏色。

示例代碼：

<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
 google.load('visualization', '1', {'packages': ['geochart']});
 google.setOnLoadCallback(drawRegionsMap);

  function drawRegionsMap() {
    var data = google.visualization.arrayToDataTable([
      ['Country', 'Popularity'],
      ['Germany', 200],
      ['United States', 300],
      ['Brazil', 400],
      ['Canada', 500],
      ['France', 600],
      ['RU', 700]
    ]);

    var options = {};

    var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
    chart.draw(data, options);
};
</script>

Answer 1

geocharts 文檔確實提供了您需要做的事情的信息。 顏色可在圖表的var options中配置。 https://developers.google.com/chart/interactive/docs/gallery/geochart#Configuration_Options

如果您只想更改默認顏色，您只需在colors:選項中指定您想要的顏色。
例如：

    var options = {
    //Put your color hex code here
    colors: ['#FF0000'] //eg. red
};

默認情況下，這會將您的數據從最淺的陰影着色到為數據值范圍（最低到最高）指定的顏色。 在您的代碼中，這將是從 200 到 700。但是，您可以指定您希望數據范圍的顏色。
例如，如果您希望數據從綠色變為藍色，您可以簡單地指定 2 種顏色。

    var options = {
    //Put your colour hex code here
    colors: ['#00FF00','#0000FF']
};

您可以為喜歡的任何顏色執行此操作，但通常如果您試圖展示國家之間的某種差異，最好只使用 2 種顏色來顯示數據的進展。 有關示例，請參見此 Fiddle 。

您可以通過上述任何選項（例如colorAxis ）更多地使用顏色。 文檔很好地解釋了這些。

Answer 2

您正在尋找以下內容：

options["defaultColor"] = '';

替換為您選擇的顏色。

Answer 3

我正在嘗試使用 Google Chart 為網站創建自定義可點擊地圖，我希望這些國家/地區可點擊並顯示其旗幟。 另外，當我在選定的國家/地區時，我希望顏色發生變化。