Panoramica
Un grafico geografico è una mappa di un paese, un continente o una regione con aree identificate in uno dei tre modi seguenti:
- La modalità regione applica colori a intere regioni, come paesi, province o stati.
- La modalità indicatori utilizza i cerchi per contrassegnare le regioni in scala in base a un valore da te specificato.
- La modalità di testo etichetta le regioni con identificatori (ad es. "Russia" o "Asia").
Un grafico geografico viene visualizzato all'interno del browser utilizzando SVG o VML. Tieni presente che il grafico geografico non è scorrevole o trascinabile e si tratta di un disegno a linee invece di una mappa del rilievo. Se vuoi qualcosa di simile, prendi in considerazione una visualizzazione della mappa.
Grafici geografici per regione
Lo stile regions
riempie intere regioni (in genere
paesi) con colori corrispondenti ai valori che
assegni.
<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>
Grafici geografici indicatori
Lo stile markers
mostra i cerchi in posizioni specificate nel grafico geografico, con il colore e la dimensione specificati.
Prova a passare il mouse sopra gli indicatori caotici intorno a Roma: si aprirà una lente d'ingrandimento per mostrare più nel dettaglio gli indicatori. (La lente d'ingrandimento non è supportata in Internet Explorer 8 o versione precedente.)
<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>
Visualizzazione degli indicatori proporzionali
Di solito, i grafici geografici degli indicatori mostrano il valore dell'indicatore più piccolo come
punto minimo. Se invece vuoi visualizzare valori degli indicatori proporzionali, ad esempio perché sono percentuali, utilizza
l'opzione sizeAxis
per impostare minValue
e maxValue
in modo esplicito.
Ecco un esempio di mappa dell'Europa occidentale con le popolazioni e le aree di tre paesi: Francia, Germania e Polonia. Le popolazioni sono tutte numeri assoluti (ad es. 65 milioni per la Francia), ma le aree sono tutte percentuali del tutto: l'indicatore Francia è di colore viola perché la sua popolazione è mediamente aritmetica, ma ha una dimensione di 50 (su un massimo di 100 possibili) perché contiene il 50% dell'area cumulativa.
In questo codice, utilizziamo sizeAxis
per specificare le dimensioni degli indicatori
nell'intervallo da 0 a 100. Utilizziamo anche colorAxis
con
valori RGB per mostrare le popolazioni sotto forma di una gamma di colori dall'arancione al
blu, uno spettro adatto agli utenti con carenze di visione dei colori. Infine, specifichiamo l'Europa occidentale con un valore region
pari a 155, come descritto nella sezione "Gerarchia dei contenuti e codici" più avanti in questo documento.
<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>
Grafici geografici di testo
Puoi sovrapporre etichette di testo su un grafico geografico con 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> <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>
Colorare il grafico
Esistono diverse opzioni per personalizzare i colori dei grafici geografici:
colorAxis
: lo spettro di colori da utilizzare per le regioni nella tabella dati.backgroundColor
: il colore di sfondo del grafico.datalessRegionColor
: il colore da assegnare alle regioni senza dati associati.defaultColor
: il colore da assegnare alle regioni nella tabella dati per le quali il valore ènull
o non specificato.
L'opzione colorAxis
è quella importante: specifica la gamma di colori per i valori dei dati. Nell'array colorAxis
, il primo elemento è il colore assegnato al valore più piccolo nel set di dati, mentre l'ultimo è il colore assegnato al valore più grande nel set di dati. Se specifichi più di due colori, verrà eseguita l'interpolazione tra loro.
Nel grafico che segue, utilizzeremo
tutte e quattro le opzioni. colorAxis
viene utilizzato per visualizzare l'Africa con
i colori della bandiera panafricana, utilizzando le latitudini dei paesi:
dal rosso nel nord, attraverso il nero, al verde nel
sud. L'opzione backgroundColor
viene utilizzata per colorare
lo sfondo di un azzurro, datalessRegionColor
per colorare
di rosa chiaro i paesi non africani e defaultColor
per
Madagascar.
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>
Caricamento in corso...
Il nome del pacchetto google.charts.load
è "geochart"
.
Tieni presente che non devi copiare le nostre mapsApiKey, perché non funzionerà. Se il tuo grafico non richiede geocodifica o utilizza codici non standard per identificare le località, non hai bisogno di un mapsApiKey. Per maggiori dettagli, vedi
Caricare le impostazioni.
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' });
Il nome della classe di visualizzazione dei grafici geografici è google.visualization.GeoChart
.
var visualization = new google.visualization.GeoChart(container);
Formato dei dati
Il formato della tabella di dati varia a seconda della modalità di visualizzazione utilizzata:
regions
, markers
o text
.
Formato della modalità Regioni
La posizione viene inserita in una colonna più una colonna facoltativa come descritto di seguito:
-
Località regione [Stringa, obbligatorio] - Una regione da evidenziare.
Sono accettati tutti i seguenti formati. Puoi utilizzare formati diversi in righe distinte:
- Il nome di un paese sotto forma di stringa (ad esempio "Inghilterra") oppure un codice ISO-3166-1 alpha-2 in maiuscolo o il relativo equivalente in inglese (ad esempio, "GB" o "Regno Unito").
- Un nome con codice regione ISO-3166-2 in maiuscolo o l'equivalente testuale in inglese (ad esempio, "US-NJ" o "New Jersey").
- Un codice dell'area metropolitana. Si tratta di codici metropolitani a tre cifre utilizzati per designare varie regioni. Sono supportati solo i codici USA. Tieni presente che non corrispondono ai prefissi telefonici.
- Qualsiasi valore supportato dalla proprietà
region
.
-
Colore regione [Numero, facoltativo] - Una colonna numerica facoltativa utilizzata per
assegnare un colore a questa regione, in base alla scala specificata nella
proprietà
colorAxis.colors
. Se questa colonna non è presente, tutte le regioni saranno dello stesso colore. Se la colonna è presente, non sono consentiti valori nulli. I valori vengono scalati in base ai valorisizeAxis.minValue
/sizeAxis.maxValue
o ai valori specificati nella proprietàcolorAxis.values
, se forniti.
Formato della modalità indicatori
Il numero di colonne varia a seconda del formato dell'indicatore utilizzato e di altre colonne facoltative.
-
Posizione indicatore [obbligatorio]
OPPURE
La prima colonna è un indirizzo di stringa specifico (ad esempio, "1600 Pennsylvania Ave").Le prime due colonne sono numeriche, dove la prima colonna indica la latitudine e la seconda colonna la longitudine.
Nota: anche se consigliamo di utilizzare i codici ISO 3166 per la modalità "regioni", la modalità "indicatori" funziona al meglio con nomi più lunghi per le regioni (come Germania, Panama e così via). Questo perché i grafici geografici, in modalità "indicatori", utilizzano Google Maps per la geocodifica delle posizioni (convertindo una posizione di stringa in latitudine e longitudine). Di conseguenza, le località ambigue non vengono geocodificate come ci si aspetta, ad esempio "DE" sta per Germania o Delaware o "PA" sta per Panama o Pennsylvania.
-
Colore indicatore [Numero, facoltativo] La colonna successiva è una colonna numerica facoltativa
utilizzata per assegnare un colore a questo indicatore in base alla scala specificata nella
proprietà
colorAxis.colors
. Se questa colonna non è presente, tutti gli indicatori saranno dello stesso colore. Se la colonna è presente, non sono consentiti valori nulli. I valori vengono scalati l'uno rispetto all'altro o assolutamente in base ai valori specificati nella proprietàcolorAxis.values
. - Dimensione indicatore [Numero, facoltativo] Una colonna numerica facoltativa utilizzata per assegnare le dimensioni dell'indicatore in relazione alle altre dimensioni dell'indicatore. Se questa colonna non è presente, verrà utilizzato il valore della colonna precedente (o la dimensione predefinita, se non viene fornita anche una colonna di colore). Se la colonna è presente, non sono consentiti valori nulli.
Formato modalità di testo
L'etichetta viene inserita nella prima colonna, più una colonna facoltativa:
- Etichetta di testo [String, Obbligatoria] Un indirizzo stringa specifico (ad esempio, "1600 Pennsylvania Ave").
- Dimensione del testo [Numero, facoltativo] La seconda colonna è una colonna numerica facoltativa utilizzata per assegnare la dimensione dell'etichetta. Se questa colonna non è presente, tutte le etichette avranno la stessa dimensione.
Opzioni di configurazione
Nome | |
---|---|
backgroundColor |
Il colore di sfondo per l'area principale del grafico. Può essere una semplice stringa di colore HTML, ad esempio Tipo: stringa o oggetto
Predefinito:bianco
|
backgroundColor.fill |
Il colore di riempimento del grafico, come stringa di colore HTML. Tipo:stringa
Predefinito:bianco
|
backgroundColor.stroke |
Il colore del bordo del grafico, come stringa di colore HTML. Tipo:stringa
Predefinito: "#666"
|
backgroundColor.strokeWidth |
Lo spessore del bordo, in pixel. Tipo:numero
Predefinito:0
|
colorAxis |
Un oggetto che specifica una mappatura tra i valori e i colori delle colonne di colori o una scala di gradienti. Per specificare le proprietà di questo oggetto, puoi utilizzare la notazione letterale oggetto, come mostrato qui: {minValue: 0, colors: ['#FF0000', '#00FF00']} Tipo:oggetto
Predefinito:null
|
colorAxis.minValue |
Se presente, specifica un valore minimo per i dati del colore del grafico. I valori dei dati relativi ai colori di questo valore e inferiori verranno visualizzati come primo colore nell'intervallo Tipo:numero
Predefinito:valore minimo della colonna del colore nei dati del grafico
|
colorAxis.maxValue |
Se presente, specifica un valore massimo per i dati del colore del grafico. I valori dei dati sui colori di questo valore e superiori verranno visualizzati come ultimo colore nell'intervallo Tipo:numero
Predefinito:valore massimo della colonna del colore nei dati del grafico
|
colorAxis.values |
Se presente, controlla in che modo i valori vengono associati ai colori. Ogni valore è associato al colore corrispondente nell'array Tipo: array di numeri
Predefinito:null
|
colorAxis.colors |
Colori da assegnare ai valori nella visualizzazione. Un array di stringhe, in cui ogni elemento è una stringa di colore HTML, ad esempio: Tipo: array di stringhe di colore
Predefinito:null
|
datalessRegionColor |
Colore da assegnare alle regioni senza dati associati. Tipo:stringa
Predefinito: "#F5F5F5"
|
defaultColor |
Il colore da utilizzare per i punti dati in un grafico geografico quando si trova la posizione
(ad es. Tipo:stringa
Predefinito: "#267114"
|
displayMode |
Che tipo di grafico geografico si tratta. Il formato DataTable deve corrispondere al valore specificato. Sono supportati i seguenti valori:
Tipo:stringa
Predefinito: "automatico"
|
dominio |
Mostra il grafico geografico come se fosse fornito da questa regione. Ad esempio, se imposti Tipo:stringa
Predefinito:null
|
enableRegionInteractivity |
Se impostato su true, attiva l'interattività delle regioni, compresi lo stato attivo e l'elaborazione della descrizione comando al passaggio del mouse, nonché la selezione e l'attivazione della regione degli eventi Il valore predefinito è true in modalità regione e false in modalità indicatore. Tipo: booleano
Predefinito:automatico
|
forceIFrame |
Disegna il grafico all'interno di un frame in linea. Tieni presente che in IE8 questa opzione viene ignorata; tutti i grafici di IE8 vengono tracciati in i-frame. Tipo: booleano
Predefinito:false
|
geochartVersion |
La versione dei dati di confine del grafico geografico. Sono disponibili le versioni Tipo:numero
Predefinito:10
|
altezza |
Altezza della visualizzazione, in pixel. L'altezza predefinita è 347 pixel, a meno che
non sia specificata l'opzione Tipo:numero
Predefinita: automatica
|
keepAspectRatio |
Se il valore è vero, il grafico geografico verrà disegnato con le dimensioni massime che possono rientrare nell'area del grafico con le proporzioni naturali. Se viene specificata solo una delle opzioni
Se il valore è false, il grafico geografico verrà ampliato fino alla dimensione esatta del grafico, come specificato dalle opzioni Tipo: booleano
Predefinito:true
|
leggenda |
Un oggetto con membri per configurare vari aspetti della legenda o "nessuno", se non deve essere visualizzata alcuna legenda. Per specificare le proprietà di questo oggetto, puoi utilizzare la notazione letterale oggetto, come mostrato qui: {textStyle: {color: 'blue', fontSize: 16}} Tipo:Oggetto / "nessuno"
Predefinito:null
|
legend.numberFormat |
Una stringa di formato per le etichette numeriche. Questo è un sottoinsieme del
set di pattern di ICU
.
Ad esempio, Tipo:stringa
Predefinita: automatica
|
legend.textStyle |
Un oggetto che specifica lo stile di testo della legenda. L'oggetto ha questo formato: { color: <string>, fontName: <string>, fontSize: <number>, bold: <boolean>, italic: <boolean> }
Tipo:oggetto
Predefinita:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
regione |
L'area da visualizzare nel grafico geografico. Verranno visualizzate anche le aree circostanti. Può essere:
Tipo:stringa
Predefinito: 'world'
|
magnifyingGlass |
Un oggetto con membri per configurare vari aspetti della lente d'ingrandimento. Per specificare le proprietà di questo oggetto, puoi utilizzare la notazione letterale oggetto, come mostrato qui: {enable: true, zoomFactor: 7.5} Tipo:oggetto
Predefinita:
{enable: true, zoomFactor: 5.0} |
magnifyingGlass.enable |
Se il valore è vero, quando l'utente si sofferma sopra un indicatore caotico, si aprirà una lente d'ingrandimento. Nota: questa funzionalità non è supportata nei browser che non supportano SVG, ad esempio Internet Explorer versione 8 o precedente. Tipo: booleano
Predefinito:true
|
magnifyingGlass.zoomFactor |
Il fattore di zoom della lente d'ingrandimento. Può essere qualsiasi numero maggiore di 0. Tipo:numero
Predefinita: 5.0
|
markerOpacity |
L'opacità degli indicatori, dove 0,0 è completamente trasparente e 1,0 è completamente opaco. Tipo:numero, 0,0-1,0
Predefinita: 1,0
|
regioncoderVersion |
La versione dei dati del codice regione. Sono disponibili le versioni Tipo:numero
Predefinita: 0
|
risoluzione |
La risoluzione dei bordi del geografico. Scegli uno dei seguenti valori:
Tipo:stringa
Predefinito: "countries"
|
sizeAxis |
Un oggetto con membri per configurare la modalità di associazione dei valori alle dimensioni delle bolle. Per specificare le proprietà di questo oggetto, puoi utilizzare la notazione letterale oggetto, come mostrato qui: {minValue: 0, maxSize: 20} Tipo:oggetto
Predefinito:null
|
sizeAxis.maxSize |
Raggio massimo della bolla più grande possibile, in pixel. Tipo:numero
Predefinito:12
|
sizeAxis.maxValue |
Il valore della dimensione (come visualizzato nei dati del grafico) da mappare a Tipo:numero
Predefinito:valore massimo della colonna della dimensione nei dati del grafico
|
sizeAxis.minSize |
Raggio minimo della bolla più piccola possibile, in pixel. Tipo:numero
Predefinito:3
|
sizeAxis.minValue |
Il valore della dimensione (come visualizzato nei dati del grafico) da mappare a Tipo:numero
Predefinito:valore minimo della colonna delle dimensioni nei dati del grafico
|
Descrizione comando |
Un oggetto con membri per configurare vari elementi della descrizione comando. Per specificare le proprietà di questo oggetto, puoi utilizzare la notazione letterale oggetto, come mostrato qui: {textStyle: {color: '#FF0000'}, showColorCode: true} Tipo:oggetto
Predefinito:null
|
tooltip.textStyle |
Un oggetto che specifica lo stile di testo della descrizione comando. L'oggetto ha questo formato: { color: <string>, fontName: <string>, fontSize: <number>, bold: <boolean>, italic: <boolean> }
Tipo:oggetto
Predefinita:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
tooltip.trigger |
L'interazione dell'utente che determina la visualizzazione della descrizione comando:
Tipo:stringa
Predefinito: "focus"
|
larghezza |
Larghezza della visualizzazione, in pixel. La larghezza predefinita è 556 pixel, a meno che
non venga specificata l'opzione Tipo:numero
Predefinita: automatica
|
Gerarchia e codici dei continenti
Puoi visualizzare i grafici geografici di continenti/subcontinenti impostando l'opzione region
su uno dei seguenti codici di tre cifre. I codici e la gerarchia si basano, con alcune eccezioni, su quelli sviluppati e gestiti dalla
Divisione Statistica delle Nazioni Unite
.
Continente | Subcontinente | Paesi |
---|---|---|
002 - Africa |
015 - Nord Africa |
DZ, EG, EH, LY, MA, SD, SS, TN |
011 - Africa occidentale |
BF, BJ, CI, CV, GH, GM, GN, GW, LR, ML, MR2}, 2 MR2}, 2 MR2},21}, {44SHSLSN | |
017 - Medio Africa |
AO, CD, ZR, CF, CG, CM, GA, GQ, ST, TD | |
014 - Africa orientale |
BI, DJ, ER, ET, KE, KM, MG, MU, MW, MZ, R2} R.RWSCSOTZUG | |
018 - Africa meridionale |
BW, LS, NA, SZ, ZA | |
150 - Europa |
154 - Europa settentrionale |
GG, JE, AX, DK, EE, FI, FO, GB, IE, IM, IS LV |
155 - Europa occidentale |
AT, BE, CH, DE, DD, FR, FX, LI, LU, MC, NL | |
151 - Europa orientale |
BG, BY, CZ, HU, MD, PL, RO, RU, SU, SK, UA | |
039 - Europa meridionale |
AD, AL, BA, ES, GI, GR, HR, IT, ME, MK, MT, 22}RS | |
019 - Americhe |
021 - Nord America |
BM, CA, GL, PM, US |
029 - Caraibi |
AG, AI, AN, AW, BB, BL, BS, CU, DM, DO, GD, GPLCMS | |
013 - America Centrale |
BZ, CR, GT, HN, MX, NI, PA, SV | |
005 - America del Sud |
AR, BO, BR, CL, CO, EC, FK, GF, GY, PE, PY , , SRVE | |
142 - Asia |
143 - Asia centrale |
TM, TJ, KG, KZ, UZ |
030 - Asia orientale |
CN, HK, JP, KP, KR, MN, MO, TW | |
034 - Asia meridionale |
AF, BD, BT, IN, IR, LK, MV, NP, PK | |
035 - Asia sudorientale |
BN, ID, KH, LA, MM, BU, MY, PH, SG, TH, TL NN2}VN | |
145 - Asia occidentale |
AE, AM, AZ, BH, CY, GE, IL, IQ, JO, KW, {20OMLB {20OMLB, | |
009 - Oceania |
053 - Australia e Nuova Zelanda |
AU, NF, NZ |
054 - Melanesia |
FJ, NC, PG, SB, VU | |
057 - Micronesia |
FM, GU, KI, MH, MP, NR, PW | |
061 - Polinesia |
AS, CK, NU, PF, PN, TK, TO, TV, WF, WS |
Metodi
Metodo | |
---|---|
clearChart() |
Cancella il grafico e rilascia tutte le risorse allocate. Tipo di reso: nessuno
|
draw(data, options) |
Disegna il grafico. Il grafico accetta ulteriori chiamate di metodo solo dopo che è stato attivato
l'evento Tipo di reso: nessuno
|
getImageURI() |
Restituisce il grafico serializzato come URI immagine. Viene chiamato dopo che il grafico è stato disegnato. Consulta la sezione Stampa di grafici PNG. Tipo di ritorno:stringa
|
getSelection() |
Restituisce un array delle entità del grafico selezionate.
Le entità selezionabili sono regioni in cui è assegnato un valore.
Per questo grafico, è possibile selezionare una sola entità alla volta.
Tipo restituito: array di elementi di selezione
|
setSelection() |
Seleziona le entità del grafico specificate. Annulla la selezione precedente.
Le entità selezionabili sono regioni in cui è assegnato un valore.
Per questo grafico è possibile selezionare una sola entità alla volta.
Tipo di reso: nessuno
|
Eventi
Nome | |
---|---|
error |
Attivato quando si verifica un errore durante il tentativo di rendering del grafico. Proprietà: id, messaggio
|
ready |
Il grafico è pronto per le chiamate di metodi esterne. Se vuoi interagire con il grafico e richiamare i metodi dopo averlo tracciato, devi impostare un listener per questo evento prima di chiamare il metodo Proprietà:nessuna
|
regionClick |
Richiamato quando si fa clic su una regione. Questo valore non verrà mostrato per il paese specifico assegnato nell'opzione "regione" (se è stato elencato un paese specifico).
Proprietà:
un oggetto con una singola proprietà,
region , ovvero una stringa in formato ISO-3166
che descrive la regione selezionata.
|
select |
Attivato quando l'utente fa clic su un'entità visiva. Per sapere quali elementi sono stati selezionati, chiama
Proprietà:nessuna
|
Norme sui dati
Le località vengono geocodificate da Google Maps. Tutti i dati che non richiedono la geocodifica non vengono inviati ad alcun server. Per ulteriori informazioni sulle norme relative ai dati, consulta i Termini di servizio di Google Maps.