圖表:GeoChart

總覽

地理圖是國家/地區、洲別或區域的地圖,在以下列三種方式之一加以識別:

  • region 模式會以不同顏色標示整個區域,例如國家/地區、省或州。
  • 標記模式會使用圓形來指派區域,這些區域會根據您指定的值調整。
  • 「text」(文字) 模式會使用 ID 來標示區域 (例如「俄羅斯」或「亞洲」)。

使用 SVGVML 即可在瀏覽器中算繪地理圖。請注意,地理圖無法捲動或拖曳,且是線條繪製,而非地形圖。如果您想使用這些圖表,請考慮改用地圖視覺化呈現

區域地理區域圖

regions 樣式會填滿整個區域 (通常是國家/地區) 的色彩,而且會對應您指定的值。

<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {
        'packages':['geochart'],
      });
      google.charts.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('regions_div'));

        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
    <div id="regions_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

標記幾何圖形

markers 樣式會在地理區域圖上的指定位置算繪圓形,並使用您指定的顏色和大小。
請嘗試將遊標懸停在羅馬周圍的雜亂標記上,這樣放大鏡隨即開啟,顯示標記的詳細資訊。(Internet Explorer 8 以下版本不支援放大鏡)。

<html>
  <head>
    <script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script>
    <script type='text/javascript'>
     google.charts.load('current', {
       'packages': ['geochart'],
       // Note: Because markers require geocoding, you'll need a mapsApiKey.
       // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
       'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
     });
     google.charts.setOnLoadCallback(drawMarkersMap);

      function drawMarkersMap() {
      var data = google.visualization.arrayToDataTable([
        ['City',   'Population', 'Area'],
        ['Rome',      2761477,    1285.31],
        ['Milan',     1324110,    181.76],
        ['Naples',    959574,     117.27],
        ['Turin',     907563,     130.17],
        ['Palermo',   655875,     158.9],
        ['Genoa',     607906,     243.60],
        ['Bologna',   380181,     140.7],
        ['Florence',  371282,     102.41],
        ['Fiumicino', 67370,      213.44],
        ['Anzio',     52192,      43.43],
        ['Ciampino',  38262,      11]
      ]);

      var options = {
        region: 'IT',
        displayMode: 'markers',
        colorAxis: {colors: ['green', 'blue']}
      };

      var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    };
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

顯示比例標記

一般來說,標記地理區域圖會以最小的點顯示最小標記值。如果您想要改為顯示比例標記值 (例如因為是百分比),請使用 sizeAxis 選項明確設定 minValuemaxValue

舉例來說,這是西歐的地圖, 其中包含法國、德國和波蘭的人口與區域資料。人口數均為絕對數字 (例如法國為 6, 500 萬個),但這些區域都是佔整體的百分比:法國標記是彩色的,因為其人口處於中等狀態,但大小為 50 (最大可能為 100),因為其中涵蓋總面積的 50%。

在這個程式碼中,我們使用 sizeAxis 指定介於 0 到 100 之間的標記大小。我們也會使用搭配 RGB 值的 colorAxis 來顯示母體做為不同顏色的色彩範圍,從橘色到藍色,這種光譜對色覺障礙的使用者來說順暢無礙。最後,根據本文件下方的「內容階層與程式碼」一節,我們以 155 的 region 指定西歐。

<html>
  <head>
    <script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script>
    <script type='text/javascript'>
     google.charts.load('current', {
       'packages': ['geochart'],
       // Note: Because markers require geocoding, you'll need a mapsApiKey.
       // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
       'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
     });
     google.charts.setOnLoadCallback(drawMarkersMap);

      function drawMarkersMap() {
      var data = google.visualization.arrayToDataTable([
        ['Country',   'Population', 'Area Percentage'],
        ['France',  65700000, 50],
        ['Germany', 81890000, 27],
        ['Poland',  38540000, 23]
      ]);

      var options = {
        sizeAxis: { minValue: 0, maxValue: 100 },
        region: '155', // Western Europe
        displayMode: 'markers',
        colorAxis: {colors: ['#e7711c', '#4374e0']} // orange to blue
      };

      var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    };
    </script>
  </head>
  <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
  </body>
</html>

文字地理區域圖表

您可以使用 displayMode: text,將文字標籤重疊在地理區域圖上。

資料和選項
  var data = google.visualization.arrayToDataTable([
    ['Country', 'Popularity'],
    ['South America', 600],
    ['Canada', 500],
    ['France', 600],
    ['Russia', 700],
    ['Australia', 600]
  ]);

  var options = { displayMode: 'text' };
完整 HTML
<html>
 <head>
  <script type='text/javascript' src="https://www.gstatic.com/charts/loader.js"></script>
  <div id="regions_div" style="width: 900px; height: 500px;"></div>

  <script type="text/javascript">
  google.charts.load('current', {
    'packages': ['geochart'],
    // Note: Because this chart requires geocoding, you'll need a mapsApiKey.
    // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
    'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
  });
  google.charts.setOnLoadCallback(drawRegionsMap);

   function drawRegionsMap() {
     var data = google.visualization.arrayToDataTable([
       ['Country', 'Popularity'],
       ['South America', 600],
       ['Canada', 500],
       ['France', 600],
       ['Russia', 700],
       ['Australia', 600]
     ]);

     var options = { displayMode: 'text' };

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

     chart.draw(data, options);
   }
  </script>
 </head>
 <body>
    <div id="chart_div" style="width: 900px; height: 500px;"></div>
 </body>
</html>

為圖表加上顏色

以下提供幾種自訂 GeoCharts 顏色的選項:

  • colorAxis:要在資料表內的區域使用的色彩色域。
  • backgroundColor:圖表的背景顏色。
  • datalessRegionColor:要指派給沒有相關資料的區域的顏色。
  • defaultColor:要指派給資料表內區域的顏色,值為 null 或未指定。

colorAxis 選項是相當重要的選項,用來指定資料值的顏色範圍。在 colorAxis 陣列中,第一個元素是資料集中最小值所指定的顏色,而最後一個元素則是資料集中最大值的顏色。如果您指定兩種以上的顏色,系統就會在這兩個顏色之間進行內插。

下圖將使用全部四個選項。colorAxis 是用來使用 pan-African 標記顏色顯示非洲,並且使用各國家/地區的緯度:從北的紅色到黑色到南部的綠色。backgroundColor 選項可用於將背景設為淺藍色,datalessRegionColor 代表非非洲國家/地區的淺粉色,defaultColor 則用於馬達加斯加。

選項
        var options = {
          region: '002', // Africa
          colorAxis: {colors: ['#00853f', 'black', '#e31b23']},
          backgroundColor: '#81d4fa',
          datalessRegionColor: '#f8bbd0',
          defaultColor: '#f5f5f5',
        };
完整網頁
<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {
        'packages':['geochart'],
        // Note: Because this chart requires geocoding, you'll need mapsApiKey.
        // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
        'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
      });
      google.charts.setOnLoadCallback(drawRegionsMap);

      function drawRegionsMap() {
        var data = google.visualization.arrayToDataTable([
          ['Country',   'Latitude'],
          ['Algeria', 36], ['Angola', -8], ['Benin', 6], ['Botswana', -24],
          ['Burkina Faso', 12], ['Burundi', -3], ['Cameroon', 3],
          ['Canary Islands', 28], ['Cape Verde', 15],
          ['Central African Republic', 4], ['Ceuta', 35], ['Chad', 12],
          ['Comoros', -12], ['Cote d\'Ivoire', 6],
          ['Democratic Republic of the Congo', -3], ['Djibouti', 12],
          ['Egypt', 26], ['Equatorial Guinea', 3], ['Eritrea', 15],
          ['Ethiopia', 9], ['Gabon', 0], ['Gambia', 13], ['Ghana', 5],
          ['Guinea', 10], ['Guinea-Bissau', 12], ['Kenya', -1],
          ['Lesotho', -29], ['Liberia', 6], ['Libya', 32], ['Madagascar', null],
          ['Madeira', 33], ['Malawi', -14], ['Mali', 12], ['Mauritania', 18],
          ['Mauritius', -20], ['Mayotte', -13], ['Melilla', 35],
          ['Morocco', 32], ['Mozambique', -25], ['Namibia', -22],
          ['Niger', 14], ['Nigeria', 8], ['Republic of the Congo', -1],
          ['Réunion', -21], ['Rwanda', -2], ['Saint Helena', -16],
          ['São Tomé and Principe', 0], ['Senegal', 15],
          ['Seychelles', -5], ['Sierra Leone', 8], ['Somalia', 2],
          ['Sudan', 15], ['South Africa', -30], ['South Sudan', 5],
          ['Swaziland', -26], ['Tanzania', -6], ['Togo', 6], ['Tunisia', 34],
          ['Uganda', 1], ['Western Sahara', 25], ['Zambia', -15],
          ['Zimbabwe', -18]
        ]);

        var options = {
          region: '002', // Africa
          colorAxis: {colors: ['#00853f', 'black', '#e31b23']},
          backgroundColor: '#81d4fa',
          datalessRegionColor: '#f8bbd0',
          defaultColor: '#f5f5f5',
        };

        var chart = new google.visualization.GeoChart(document.getElementById('geochart-colors'));
        chart.draw(data, options);
      };
    </script>
  </head>
  <body>
    <div id="geochart-colors" style="width: 700px; height: 433px;"></div>
  </body>
</html>

載入中

google.charts.load 套件名稱為 "geochart"。請注意,請不要複製 mapsApiKey,無法使用。只要您的圖表不需要地理編碼,或使用非標準代碼來識別位置,您就不需要 mapsApiKey。詳情請參閱 載入設定

  google.charts.load('current', {
    'packages': ['geochart'],
    // Note: if your chart requires geocoding or uses nonstandard codes, you'll
    // need to get a mapsApiKey for your project. The one below won't work.
    // See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
    'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
  });

地理區域圖視覺化類別名稱為 google.visualization.GeoChart

  var visualization = new google.visualization.GeoChart(container);

資料格式

資料表的格式會因您使用的顯示模式而異:regionsmarkerstext

區域模式格式

一個資料欄會輸入地區,再加上一個選用資料欄,如下所示:

  1. 區域位置 [字串,必要] - 要醒目顯示的區域。系統支援以下所有格式。你可以在不同的資料列中使用不同格式:
    • 以字串表示的國家/地區名稱 (例如「英格蘭」)、大寫的 ISO-3166-1 alpha-2 代碼或對應的英文文字 (例如「GB」或「United Kingdom」)。
    • 大寫的 ISO-3166-2 區碼名稱或英文文字對等項目 (例如「US-NJ」或「New Jersey」)。
    • 「都會區代碼」。這些是三位數的都會區代碼,用於指定多個區域;僅支援美國代碼。請注意,這些電話與電話區碼「不」相同。
    • region 屬性支援的任何值。
  2. 區域顏色 [數字,選用] - 根據 colorAxis.colors 屬性中指定的比例,為這個區域指定顏色的選用數值欄。如果未提供這個資料欄,所有區域都會產生相同顏色。如果資料欄存在,則不得使用空值。系統會依據 sizeAxis.minValue/sizeAxis.maxValue 值或 colorAxis.values 屬性指定的值 (如有提供) 縮放值。

標記模式格式

欄數會因使用的標記格式和其他選用資料欄而異。

  • 標記位置 [必要]
    第一欄是特定字串地址 (例如「1600 Pennsylvania Ave」)。

    前兩欄為數字,第一欄是緯度,第二欄是經度。

    注意:雖然我們建議在「區域」模式中使用 ISO 3166 代碼,但「標記」模式搭配較長的區域 (例如德國、巴拿馬等) 時,效果最佳。這是因為在「標記」模式中,地理區域圖會使用 Google 地圖對地點進行地理編碼 (將字串位置轉換為經緯度位置)。這可能會導致系統無法像您預期的方式進行地理編碼;例如,「DE」代表德國或德拉瓦州,或是代表巴拿馬或賓州的「PA」。

  • 標記顏色 [數字,選用] 下一欄是選用的數值欄,會根據 colorAxis.colors 屬性中指定的比例,為標記指定顏色。如果沒有這個資料欄,所有標記都會採用相同顏色。如果資料欄存在,則不得使用空值。值是相對縮放,或絕對值根據 colorAxis.values 屬性中指定的值進行縮放。
  • 標記大小 [數字,選用] 用於指定標記大小與其他標記大小的選用數值欄。如未提供這個資料欄,系統會採用先前資料欄的值 (如果同時未提供顏色欄,則會採用預設大小)。如果有資料欄,則不允許空值。

文字模式格式

請在第一欄中輸入標籤,另加上一個選用資料欄:

  • 文字標籤 [String必填] 特定字串地址 (例如「1600 Pennsylvania Ave」)。
  • 文字大小 [數字,選填] 第二欄是選填的數字欄,用於指派標籤大小。如果沒有這個資料欄,所有標籤的大小都會相同。

設定選項

名稱
backgroundColor

圖表主要區域的背景顏色。可以是簡單的 HTML 顏色字串 (例如 'red''#00cc00'),或具有下列屬性的物件。

類型:字串或物件
預設:白色
backgroundColor.fill

圖表填滿顏色,以 HTML 顏色字串表示。

類型:字串
預設:白色
backgroundColor.stroke

圖表邊框顏色,以 HTML 顏色字串表示。

類型:字串
預設值:「#666」
backgroundColor.strokeWidth

邊框寬度 (以像素為單位)。

類型:數字
預設值:0
colorAxis

這個物件可指定顏色資料欄值與顏色或漸層比例之間的對應關係。如要指定這個物件的屬性,您可以使用物件常值標記法,如下所示:

 {minValue: 0,  colors: ['#FF0000', '#00FF00']}
類型:物件
預設值:null
colorAxis.minValue

如果有出現,可指定圖表顏色資料的最小值。這個值及較低的顏色資料值會算繪為 colorAxis.colors 範圍中的第一個顏色。

類型:數字
預設值:圖表資料中顏色欄的最小值
colorAxis.maxValue

如果有出現,就可以指定圖表顏色資料的最大值。這個值及較高的顏色資料值會轉譯為 colorAxis.colors 範圍中的最後一個顏色。

類型:數字
預設:圖表資料中顏色欄的最大值
colorAxis.values

如果有,即可控管值與顏色的關聯方式。每個值都會與 colorAxis.colors 陣列中的對應顏色相關聯。這些值適用於圖表顏色資料。系統會依據此處指定值的漸層完成上色。不指定這個選項的值等同於指定 [minValue, maxValue]。

類型:數字陣列
預設值:null
colorAxis.colors

要在圖表中指派給值的顏色。字串陣列,其中每個元素都是 HTML 顏色字串,例如:colorAxis: {colors:['red','#004411']}。您必須至少有兩個值:漸層會包含所有的值以及計算出的中介值,第一個顏色是最小值,最後一個顏色則代表最高。

類型:色彩字串陣列
預設值:null
datalessRegionColor

這個顏色會指派給沒有相關資料的區域。

類型:字串
預設: '#F5F5F5'
defaultColor

在位置 (例如'US') 存在,但該值為 null 或未指定。這與 datalessRegionColor 不同,後者是缺少資料時使用的顏色。

類型:字串
預設值: '#267114'
displayMode

此為地理區域圖類型。DataTable 的格式必須符合指定的值。支援下列值:

  • 「auto」- 根據 DataTable 的格式選擇。
  • 「regions」:在地理區域圖上為區域設定顏色。
  • 'markers' - 將標記放置於區域。
  • 「text」:以 DataTable 提供的文字為區域加上標籤。
類型:字串
預設:「auto」
網域

顯示地理區域圖,如同系統從這個區域提供的方式。舉例來說,如果將 domain 設為 'IN',系統就會顯示屬於印度的喀什米爾,而非爭議地域。

類型:字串
預設值:null
enableRegionInteractivity

設為 true 時,啟用區域互動功能,包括滑鼠懸停時的焦點和工具提示等,以及滑鼠點擊時選取區域和 regionClickselect 事件。

區域模式的預設值是 true,標記模式則為 false。

類型:布林值
預設:自動
forceIFrame

在內嵌頁框中繪製圖表。(請注意,在 IE8 中,系統會忽略此選項;所有 IE8 圖表都會繪製成 iFrame。)

類型:布林值
預設值:false
geochartVersion

地理圖邊框資料版本。已推出 1011 版本。

類型:數字
預設值:10
高度

視覺化內容的高度,以像素為單位。預設高度為 347 像素,但如果指定了 width 選項,且 keepAspectRatio 設為 true,高度會據此計算高度。

類型:數字
預設:自動
keepAspectRatio

設為 true 時,地理圖將以自然顯示比例顯示在圖表區域中的最大尺寸。如果只指定 widthheight 選項之一,系統會依顯示比例計算另一個選項。

如果設為 False,地理圖會依照 widthheight 選項指定的確切大小,延展至圖表確切大小。

類型:布林值
預設值:true
傳說

可讓成員設定圖例不同層面的物件;如果沒有任何圖例,則為「無」。如要指定這個物件的屬性,您可以使用物件常值標記法,如下所示:

 {textStyle: {color: 'blue', fontSize: 16}}
類型:物件/「無」
預設值:null
legend.numberFormat

數字標籤的格式字串。這是 ICU 模式集 的子集。舉例來說,{numberFormat:'.##'} 會針對值 10.666、10.6 和 10,顯示「10.66」、「10.6」和「10.0」。

類型:字串
預設:自動
legend.textStyle

指定圖例文字樣式的物件。物件的格式如下:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color 可以是任何 HTML 顏色字串,例如 'red''#00cc00'。另請參閱 fontNamefontSize

類型:物件
預設: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
地區

要在地理圖中顯示的區域。(同時也會顯示鄰近區域)。可以是下列其中一項:

  • 「世界」:呈現整個世界的地理圖。
  • 洲別或子洲別,以 3 位數代碼指定,例如「011」代表西非。
  • 國家/地區,以 ISO 3166-1 alpha-2 代碼指定,例如澳洲則為「AU」。
  • 美國境內的州,使用 ISO 3166-2:US 代碼指定,例如阿拉巴馬州為「US-AL」。請注意,resolution 選項必須設為「州/省」或「都會區」。
類型:字串
預設:「world」
magnifyingGlass

包含成員,可設定放大鏡各層面的物件。如要指定這個物件的屬性,您可以使用物件常值標記法,如下所示:

{enable: true, zoomFactor: 7.5}
類型:物件
預設: {enable: true, zoomFactor: 5.0}
magnifyingGlass.enable

如果設為 true,當使用者停留在堆滿的標記上時,會開啟放大鏡。

注意:在不支援 SVG (也就是 Internet Explorer 8 以下版本) 的瀏覽器上,無法使用這項功能。

類型:布林值
預設值:true
magnifyingGlass.zoomFactor

放大鏡的縮放係數。可以是大於 0 的任何數字。

類型:數字
預設值:5.0
markerOpacity

標記的不透明度,其中 0.0 表示完全透明,1.0 表示完全不透明。

類型:數字,0.0–1.0
預設值:1.0
regioncoderVersion

區碼器資料的版本。已推出 01 版本。

類型:數字
預設值:0
解析度

地理圖邊框的解析度。請選擇下列其中一個值:

  • 「國家/地區」:支援所有區域,但美國州級區域除外。
  • 「州/省」- 僅適用於國家/地區和美國州級區域。部分國家/地區不支援這項功能,請先測試國家/地區,確認系統是否支援此選項。
  • 「都會區」:僅支援美國的國家/地區和美國州級區域。
類型:字串
預設: 'countries'
sizeAxis

具備成員的物件,可設定值與對話框大小建立關聯的方式。如要指定這個物件的屬性,您可以使用物件常值標記法,如下所示:

 {minValue: 0,  maxSize: 20}
類型:物件
預設值:null
sizeAxis.maxSize

最大說明框的半徑上限,以像素為單位。

類型:數字
預設值:12
sizeAxis.maxValue

要對應至 sizeAxis.maxSize 的大小值 (顯示於圖表資料中)。 系統會將較大的值裁剪為這個值。

類型:數字
預設:圖表資料中「大小」欄的最大值
sizeAxis.minSize

對話框的最小半徑範圍 (以像素為單位)。

類型:數字
預設值:3
sizeAxis.minValue

要對應至 sizeAxis.minSize 的大小值 (顯示於圖表資料中)。 系統會將較小的值裁剪為這個值。

類型:數字
預設值:圖表資料中「大小」欄的最小值
工具提示

可讓成員設定各種工具提示元素的物件。如要指定這個物件的屬性,您可以使用物件常值標記法,如下所示:

{textStyle: {color: '#FF0000'}, showColorCode: true}
類型:物件
預設值:null
tooltip.textStyle

指定工具提示文字樣式的物件。物件的格式如下:

{ color: <string>,
  fontName: <string>,
  fontSize: <number>,
  bold: <boolean>,
  italic: <boolean> }
    

color 可以是任何 HTML 顏色字串,例如 'red''#00cc00'。另請參閱 fontNamefontSize

類型:物件
預設: {color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
tooltip.trigger

觸發工具提示的使用者互動:

  • 「焦點」- 當使用者將遊標懸停在元素上時,就會顯示工具提示。
  • 「無」- 不會顯示工具提示。
  • 「selection」- 使用者選取元素時,系統會顯示工具提示。
類型:字串
預設:「focus」
寬度

視覺呈現的寬度,以像素為單位。預設寬度為 556 像素,除非已指定 height 選項,且 keepAspectRatio 設為 true,在這種情況下,會採用相應的寬度計算。

類型:數字
預設:自動

 

洲別階層和代碼

如要顯示洲別/子洲的地理區域圖,請將 region 選項設為下列其中一個 3 位數代碼。代碼和階層結構是以 聯合國統計處 開發及維護的項目為主,但有些例外情況。

大陸 子洲別 國家/地區
002 - 非洲 015 - 北非 DZEGEHLYMASDSSTN
011 - 西非 BFBJCICVGHGMGNGWL8、{20 {20 {20 {20SHSLSN
017 - 中非 AOCDZRCFCGCMGAGQSTTD
014 - 東非 BIDJERETKEKMMGMUMZMZRWSCSOTZUG
018 - 南非 BWLSNASZZA
150 - 歐洲 154 - 北歐 GGJEAXDKEEFIFOGBIEIMISLV
155 - 西歐 ATBECHDEDDFRFXLILUMCNL
151 - 東歐 BGBYCZHUMDPLRORUSUSKUA
039 - 南歐 ADALBAESGIGRHRITMEMKMT2 MT
019 - 美洲 021 - 北美 BMCAGLPMUS
029 - 加勒比海 AGAIANAWBBBLBSCUDMDOGDGPLCMS
013 - 中美洲 BZCRGTHNMXNIPASV
005 - 南美洲 ARBOBRCLCOECFKGFGYPEPR7{/23SRVE
142 - 亞洲 143 - 中亞 TMTJKGKZUZ
030 - 東亞 中國HK日本KPKRMNMOTW
034 - 南亞 AFBDBTINIRLKMVNPPK
035 - 東南亞 BNIDKHLAMMBUMYPHSGTH{/21 TLVN
145 - 西亞 AEAMAZBHCYGEILIQJO
009 - 大洋洲 053 - 澳洲和紐西蘭 AUNFNZ
054 - 美拉尼西亞 FJNCPGSBVU
057 - 密克羅尼西亞 FMGUKIMHMPNRPW
061 - 波里尼西亞 ASCKNUPFPNTKTOTVWFWS

方法

方法
clearChart()

清除圖表並釋出所有分配的資源。

傳回類型:
draw(data, options)

繪製圖表。只有在觸發 ready 事件後,圖表才能接受其他方法呼叫。Extended description

傳回類型:
getImageURI()

傳回已序列化為圖片 URI 的圖表。

請在繪製圖表「之後」呼叫此動作。

請參閱列印 PNG 圖表

傳回類型:字串
getSelection()

傳回所選圖表實體的陣列。 可選取實體是已獲派值的區域。在這張圖表中,無論何時都只能選取一個實體。 Extended description

傳回類型:選取元素的陣列
setSelection()

選取指定的圖表實體。取消先前選取的任何項目。 可選取實體是已獲派值的區域。在這張圖表中,一次只能選取一個實體。 Extended description

傳回類型:

事件

名稱
error

嘗試算繪圖表時發生錯誤時觸發。

屬性:ID、訊息
ready

圖表已可供外部方法呼叫。如果您想與圖表互動,並在繪製後呼叫方法,您應「先」設定此事件的事件監聽器,並只在事件觸發後才呼叫這些事件。draw

屬性:
regionClick

點按區域時呼叫。但不適用於「區域」選項中所指派的特定國家/地區 (如果清單列出特定國家/地區)。

屬性:含有單一屬性 region 的物件,這是採用 ISO-3166 格式的字串,用來描述使用者點選的地區。
select

在使用者點選視覺實體時觸發。如要瞭解已選取的項目,請呼叫 getSelection()

屬性:

資料政策

Google 地圖會為地點進行地理編碼。不需要地理編碼的資料不會傳送至任何伺服器。如要進一步瞭解資料政策,請參閱《Google 地圖服務條款》。