Présentation
Un graphique géographique est la carte d'un pays, d'un continent ou d'une région, avec des zones identifiées selon l'une des trois méthodes suivantes:
- Le mode région colore des régions entières, comme des pays, des provinces ou des États.
- Le mode Repères utilise des cercles pour désigner des régions qui sont mises à l'échelle en fonction d'une valeur que vous spécifiez.
- Le mode text étiquette les régions avec des identifiants (par exemple, "Russie" ou "Asie").
Un graphique géographique est affiché dans le navigateur à l'aide du format SVG ou VML. Notez qu'il n'est pas possible de faire défiler le graphique géographique, ni de le faire glisser. Il s'agit d'un dessin au trait plutôt que d'une carte en relief. Envisagez plutôt de visualiser une carte si vous le souhaitez.
Graphiques géographiques par région
Le style regions remplit des régions entières (généralement des pays) avec des couleurs correspondant aux valeurs que vous attribuez.
<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>
Graphiques géographiques des repères
Le style markers affiche des cercles aux emplacements spécifiés sur le graphique géographique, avec la couleur et la taille que vous spécifiez.
Essayez de pointer sur les repères surchargés autour de Rome. Une loupe s'ouvre pour les afficher plus en détail. (La loupe n'est pas compatible avec Internet Explorer version 8 ou antérieure.)
<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>
Afficher des repères proportionnels
Normalement, les graphiques géographiques des repères affichent la plus petite valeur de repère sous la forme d'un point minimal. Si vous souhaitez afficher des valeurs de repère proportionnelles (par exemple, parce qu'il s'agit de pourcentages), utilisez l'option sizeAxis pour définir minValue et maxValue explicitement.
Par exemple, voici une carte de l'Europe occidentale avec des populations et des zones pour trois pays: l'Allemagne, la France et la Pologne. Les populations sont toutes des nombres absolus (par exemple, 65 millions pour la France), mais les zones représentent toutes des pourcentages de l'ensemble: le repère "France" est de couleur violette, car sa population est moyenne, mais sa taille est de 50 (sur 100 possibles), car il représente 50% de la surface totale combinée.
Dans ce code, nous utilisons sizeAxis pour spécifier des tailles de repère comprises entre 0 et 100. Nous utilisons également un colorAxis avec des valeurs RVB pour afficher les populations sous la forme d'une gamme de couleurs allant de l'orange au bleu, un spectre qui convient aux utilisateurs souffrant de déficiences visuelles. Enfin, nous spécifions l'Europe de l'Ouest avec un region de 155, conformément à la section "Hiérarchie de contenu et codes" plus loin dans ce document.
<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>
Graphiques géographiques textuels
Vous pouvez superposer des libellés textuels à un graphique géographique avec 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>
Appliquer des couleurs à votre graphique
Il existe plusieurs options pour personnaliser les couleurs des graphiques géographiques:
colorAxis: spectre de couleurs à utiliser pour les régions du tableau de données.backgroundColor: couleur d'arrière-plan du graphique.datalessRegionColor: couleur à attribuer aux régions sans données associées.defaultColor: couleur à attribuer aux régions du tableau de données pour lesquelles la valeur estnullou non spécifiée.
L'option colorAxis est la plus importante: elle spécifie la plage de couleurs pour les valeurs de vos données. Dans le tableau colorAxis, le premier élément correspond à la couleur attribuée à la plus petite valeur de l'ensemble de données, et le dernier élément à la couleur attribuée à la plus grande valeur de l'ensemble de données. Si vous spécifiez plus de deux couleurs, une interpolation se produit entre elles.
Dans le graphique suivant, nous utiliserons les quatre options. colorAxis permet d'afficher l'Afrique avec les couleurs du drapeau panafricain, en utilisant les latitudes des pays : du rouge au nord au noir et du vert au sud. L'option backgroundColor permet de colorer l'arrière-plan en bleu clair, datalessRegionColor pour colorer les pays non africains en rose clair et defaultColor pour 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>
Chargement...
Le nom du package google.charts.load est "geochart".
Notez que vous ne devez pas copier notre "mapsApiKey", car cela ne fonctionnera pas. Tant que votre graphique ne nécessite pas de géocodage ou n'utilise pas de codes non standards pour identifier les lieux, vous n'avez pas besoin d'une carte mapsApiKey. Pour en savoir plus, consultez
Charger les paramètres.
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'
});
Le nom de la classe de visualisation du graphique géographique est google.visualization.GeoChart.
var visualization = new google.visualization.GeoChart(container);
Format des données
Le format de la table de données varie en fonction du mode d'affichage que vous utilisez : regions, markers ou text.
Format du mode Régions
La zone géographique est indiquée dans une colonne, plus une colonne facultative comme décrit ci-dessous:
-
Zone géographique [chaîne, obligatoire] : région à mettre en surbrillance.
Tous les formats suivants sont acceptés. Vous pouvez utiliser différents formats dans différentes lignes :
- Nom d'un pays sous forme de chaîne (par exemple, "Angleterre"), code ISO-3166-1 alpha-2 en majuscules ou son équivalent en texte en anglais (par exemple, "GB" ou "Royaume-Uni").
- Nom de code régional ISO-3166-2 en majuscules ou son équivalent en texte anglais (par exemple, "US-NJ" ou "New Jersey").
- Indicatif de zone métropolitaine. Il s'agit de codes d'agglomération à trois chiffres servant à désigner différentes régions. Les codes américains ne sont acceptés que. Notez qu'ils sont différents des indicatifs téléphoniques.
- Toute valeur acceptée par la propriété
region.
-
Couleur de la région [Nombre, facultatif] : colonne numérique facultative permettant d'attribuer une couleur à cette région en fonction de l'échelle spécifiée dans la propriété
colorAxis.colors. Si cette colonne n'est pas présente, toutes les régions seront de la même couleur. Si la colonne est présente, les valeurs nulles ne sont pas autorisées. Les valeurs sont mises à l'échelle par rapport aux valeurssizeAxis.minValue/sizeAxis.maxValueou aux valeurs spécifiées dans la propriétécolorAxis.values, le cas échéant.
Format du mode Repères
Le nombre de colonnes varie en fonction du format de repère utilisé et d'autres colonnes facultatives.
-
Emplacement du repère [obligatoire]
OU
La première colonne correspond à une chaîne d'adresse spécifique (par exemple, "1600 avenue des Champs-Élysées").Les deux premières colonnes sont numériques, la première colonne à la latitude et la deuxième à la longitude.
Remarque:Bien que nous vous recommandions d'utiliser des codes ISO 3166 pour le mode "Régions", le mode "Repères" fonctionne mieux avec les noms plus longs des régions (comme l'Allemagne, le Panama, etc.). En effet, lorsqu'ils sont en mode "repères", les graphiques géographiques utilisent Google Maps pour géocoder les établissements (en convertissant un emplacement de chaîne en latitude et en longitude). Par conséquent, les zones géographiques ambiguës peuvent ne pas être géocodées comme vous le souhaiteriez. Par exemple, "DE" correspond à l'Allemagne ou au Delaware, ou "PA" au Panama ou à la Pennsylvanie.
-
Couleur du repère [Nombre, facultatif] La colonne suivante est une colonne numérique facultative utilisée pour attribuer une couleur à ce repère, en fonction de l'échelle spécifiée dans la propriété
colorAxis.colors. Si cette colonne n'est pas présente, tous les repères seront de la même couleur. Si la colonne est présente, les valeurs nulles ne sont pas autorisées. Les valeurs sont mises à l'échelle les unes par rapport aux autres, ou totalement par rapport aux valeurs spécifiées dans la propriétécolorAxis.values. - Taille du repère [Nombre, facultatif] : colonne numérique facultative permettant d'attribuer la taille du repère par rapport aux autres tailles de repère. Si cette colonne n'est pas présente, la valeur de la colonne précédente est utilisée (ou la taille par défaut, si aucune colonne de couleur n'est également fournie). Si la colonne est présente, les valeurs nulles ne sont pas autorisées.
Format du mode Texte
Le libellé est saisi dans la première colonne, plus une colonne facultative:
- Libellé de texte [chaîne, obligatoire] : chaîne d'adresse spécifique (par exemple, "1600 Pennsylvania Ave").
- Taille du texte [Nombre, facultatif] La deuxième colonne est une colonne numérique facultative utilisée pour attribuer la taille du libellé. Si cette colonne n'est pas présente, tous les libellés auront la même taille.
Options de configuration
| Nom | |
|---|---|
| backgroundColor |
Couleur d'arrière-plan de la zone principale du graphique. Il peut s'agir d'une simple chaîne de couleur HTML, par exemple Type:chaîne ou objet
Par défaut:blanc
|
| backgroundColor.fill |
Couleur de remplissage du graphique, sous forme de chaîne de couleur HTML. Type:chaîne
Par défaut:blanc
|
| backgroundColor.stroke |
Couleur de la bordure du graphique, sous forme de chaîne de couleur HTML. Type:chaîne
Par défaut : "#666"
|
| backgroundColor.strokeWidth |
Largeur de la bordure, en pixels. Type:nombre
Par défaut:0
|
| colorAxis |
Objet qui spécifie une correspondance entre les valeurs des colonnes de couleur et les couleurs, ou une échelle de dégradé. Pour spécifier les propriétés de cet objet, vous pouvez utiliser la notation littérale d'objet, comme indiqué ci-dessous: {minValue: 0, colors: ['#FF0000', '#00FF00']}
Type:objet
Par défaut:null
|
| colorAxis.minValue |
Si ce champ est présent, il indique une valeur minimale pour les données de couleur du graphique. Les valeurs de données de couleur de cette valeur et des valeurs inférieures seront affichées en tant que première couleur dans la plage Type:nombre
Par défaut:valeur minimale de la colonne de couleur dans les données du graphique
|
| colorAxis.maxValue |
S'il est présent, spécifie une valeur maximale pour les données de couleur du graphique. Les valeurs de données de couleur supérieures ou égales à cette valeur seront affichées en tant que dernière couleur de la plage Type:nombre
Par défaut:valeur maximale de la colonne de couleur dans les données du graphique
|
| colorAxis.values |
Le cas échéant, contrôle la manière dont les valeurs sont associées aux couleurs. Chaque valeur est associée à la couleur correspondante dans le tableau Type:tableau de nombres
Par défaut:null
|
| colorAxis.colors |
Couleurs à attribuer aux valeurs de la visualisation. Tableau de chaînes, où chaque élément est une chaîne de couleur HTML, par exemple: Type:tableau de chaînes de couleurs
Par défaut:null
|
| datalessRegionColor |
Couleur à attribuer aux régions sans données associées. Type:chaîne
Par défaut : "#F5F5F5"
|
| defaultColor |
Couleur à utiliser pour les points de données d'un graphique géographique lorsque le lieu (par exemple, Type:chaîne
Par défaut : "#267114"
|
| displayMode |
Type de graphique géographique dont il s'agit. Le format du tableau de données doit correspondre à la valeur spécifiée. Les valeurs suivantes sont acceptées:
Type:chaîne
Par défaut : "auto"
|
| domaine |
Affichez le graphique géographique comme s'il était diffusé depuis cette région. Par exemple, si vous définissez Type:chaîne
Par défaut:null
|
| enableRegionInteractivity |
Si la valeur est définie sur "true", activez l'interactivité de la région, y compris le focus et l'élaboration de l'info-bulle au passage de la souris, ainsi que la sélection et le déclenchement de la région des événements La valeur par défaut est "true" en mode région et "false" en mode repère. Type:booléen
Par défaut:automatique
|
| forceIFrame |
Dessine le graphique dans un cadre intégré. Notez que dans IE8, cette option est ignorée, car tous les graphiques IE8 sont dessinés dans des i-frames. Type:booléen
Par défaut : "false"
|
| geochartVersion |
Version des données de bordure GeoChart. Les versions Type:nombre
Par défaut:10
|
| taille |
Hauteur de la visualisation, en pixels. La hauteur par défaut est de 347 pixels, sauf si l'option Type:nombre
Par défaut:auto
|
| keepAspectRatio |
Si la valeur est "true", le graphique géographique est dessiné à la taille la plus grande pouvant tenir dans la zone de graphique avec ses proportions naturelles. Si une seule des options
Si la valeur est "false", le graphique géographique est étiré à la taille exacte du graphique, comme spécifié par les options Type:booléen
Valeur par défaut : "true"
|
| légende |
Objet avec des membres pour configurer les différents aspects de la légende, ou "aucune" si aucune légende ne doit apparaître. Pour spécifier les propriétés de cet objet, vous pouvez utiliser la notation littérale d'objet, comme indiqué ci-dessous: {textStyle: {color: 'blue', fontSize: 16}}
Type:objet / 'aucun'
Par défaut:null
|
| legend.numberFormat |
Chaîne de format pour les étiquettes numériques. Il s'agit d'un sous-ensemble de l'
ensemble de modèles ICU
.
Par exemple, Type:chaîne
Par défaut:auto
|
| legend.textStyle |
Objet qui spécifie le style du texte de la légende. L'objet a le format suivant:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Type:objet
Par défaut:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| region |
Zone à afficher dans le graphique géographique. (Les zones environnantes sont également affichées.) Il peut s'agir de l'un des éléments suivants:
Type:chaîne
Par défaut : "world"
|
| magnifyingGlass |
Objet avec des membres permettant de configurer divers aspects de la loupe. Pour spécifier les propriétés de cet objet, vous pouvez utiliser la notation littérale d'objet, comme indiqué ci-dessous: {enable: true, zoomFactor: 7.5}
Type:Object
Par défaut:
{enable: true, zoomFactor: 5.0} |
| magnifyingGlass.enable |
Si la valeur est "true", lorsque l'utilisateur s'attarde sur un repère surchargé, une loupe s'ouvre. Remarque: Cette fonctionnalité n'est pas compatible avec les navigateurs qui ne sont pas compatibles avec le SVG, c'est-à-dire Internet Explorer version 8 ou antérieure. Type:booléen
Valeur par défaut : "true"
|
| magnifyingGlass.zoomFactor |
Facteur de zoom de la loupe. Peut être tout nombre supérieur à 0. Type:nombre
Par défaut:5.0
|
| markerOpacity |
Opacité des marqueurs : 0.0 correspond à une transparence totale et 1.0 à totalement opaque. Type:nombre, 0,0–1,0
Par défaut:1.0
|
| regioncoderVersion |
Version des données du regioncoder. Les versions Type:nombre
Par défaut:0
|
| resolution |
Résolution des bordures du graphique géographique. Choisissez l'une des valeurs suivantes :
Type:chaîne
Par défaut : "countries" (pays).
|
| sizeAxis |
Objet avec des membres permettant de configurer la manière dont les valeurs sont associées à la taille des bulles. Pour spécifier les propriétés de cet objet, vous pouvez utiliser la notation littérale d'objet, comme indiqué ci-dessous: {minValue: 0, maxSize: 20}
Type:objet
Par défaut:null
|
| sizeAxis.maxSize |
Rayon maximal de la bulle la plus grande possible (en pixels). Type:nombre
Par défaut:12
|
| sizeAxis.maxValue |
Valeur de taille (telle qu'affichée dans les données du graphique) à mapper avec Type:nombre
Par défaut:valeur maximale de la colonne de taille dans les données du graphique
|
| sizeAxis.minSize |
Rayon minimal de la bulle la plus petite possible (en pixels). Type:nombre
Par défaut:3
|
| sizeAxis.minValue |
Valeur de taille (telle qu'affichée dans les données du graphique) à mapper avec Type:nombre
Par défaut:valeur minimale de la colonne de taille dans les données du graphique
|
| Info-bulle |
Objet avec des membres permettant de configurer divers éléments d'info-bulle. Pour spécifier les propriétés de cet objet, vous pouvez utiliser la notation littérale d'objet, comme indiqué ci-dessous: {textStyle: {color: '#FF0000'}, showColorCode: true}
Type:objet
Par défaut:null
|
| tooltip.textStyle |
Objet spécifiant le style de texte de l'info-bulle. L'objet a le format suivant:
{ color: <string>,
fontName: <string>,
fontSize: <number>,
bold: <boolean>,
italic: <boolean> }
Type:objet
Par défaut:
{color: 'black', fontName: <global-font-name>, fontSize: <global-font-size>}
|
| tooltip.trigger |
Interaction de l'utilisateur qui entraîne l'affichage de l'info-bulle:
Type:chaîne
Par défaut : "focus"
|
| largeur |
Largeur de la visualisation, en pixels. La largeur par défaut est de 556 pixels, sauf si l'option Type:nombre
Par défaut:auto
|
Hiérarchie et codes des continents
Vous pouvez afficher des graphiques géographiques des continents et sous-continents en définissant l'option region sur l'un des codes à trois chiffres suivants. Les codes et la hiérarchie sont basés, à quelques exceptions près, sur ceux développés et gérés par la
Division de statistique des Nations Unies
.
| Continent | Sous-continent | Pays |
|---|---|---|
002 – Afrique |
015 - Afrique du Nord |
DZ, EG, EH, LY, MA, SD, SS, TN |
011 - Afrique de l'Ouest |
BF, BJ, CI, CV, GH, GM, GN, GW, LR, ML, MR, {2G {2G{/2 {3,21} {2G{/2 {3,2}SHSLSN | |
017 - Afrique centrale |
AO, CD, ZR, CF, CG, CM, GA, GQ, ST, TD | |
014 - Afrique de l'Est |
BI4, DJ, ER, ET, KE, KM, MG, MU, MW, MZ, RE2}, RE2, {2{2 {3SC{12RWSCSOTZUG | |
018 - Afrique australe |
BW, LS, NA, SZ, ZA | |
150 – Europe |
154 – Europe du Nord |
GG, JE, AX, DK, EE, FI, FO, Go, IE, IM, IS, {2,2{/2 {2LV |
155 – Europe de l'Ouest |
AT, BE, CH, DE, DD, FR, FX, LI, LU, MC, NL | |
151 – Europe de l'Est |
BG, BY, CZ, HU, MD, PL, RO, RU, SU, SK, UA | |
039 – Europe du Sud |
AD2, AL, BA, ES, GI, GR, HR, IT, ME, MK, MT, {22, {22, {22 SMPT | |
019 – Amériques |
021 – Amérique du Nord |
BM, CA, GL, PM, États-Unis |
029 – Caraïbes |
AGBBCUDMGDGPLCMS | |
013 – Amérique centrale |
BZ, CR, GT, HN, MX, NI, PA, SV | |
005 – Amérique du Sud |
AR, BO, BR, CL, CO, EC, FK, GF, GY, PE, PY,{32 {4SRU2}SRVE | |
142 – Asie |
143 - Asie centrale |
TM, TJ, KG, KZ, UZ |
030 - Asie de l'Est |
CN, HK, JP, KP, KR, MN, MO, TW | |
034 - Asie du Sud |
AF, BD, BT, IN, IR, LK, MV, NP, PK | |
035 - Asie du Sud-Est |
BN, ID, KH, LA, MM, BU, MY, PH, SG, TH, TL, VN | |
145 - Asie de l'Ouest |
AE, AM, AZ, BH, CY, GE, IL, IQ, JO, KW, LB | |
009 – Océanie |
053 – Australie et Nouvelle-Zélande |
AU, NF, NZ |
054 – Mélanésie |
FJ, NC, PG, SB, VU | |
057 - Micronésie |
FM, GU, KI, MH, MP, NR, PW | |
061 – Polynésie |
AS, CK, NU, PF, PN, TK, TO, TV, WF, WS |
Méthodes
| Méthode | |
|---|---|
clearChart() |
Efface le graphique et libère toutes les ressources allouées. Return Type (Type renvoyé) : aucun
|
draw(data, options) |
Permet de dessiner le graphique. Le graphique n'accepte d'autres appels de méthode qu'après le déclenchement de l'événement Return Type (Type renvoyé) : aucun
|
getImageURI() |
Renvoie le graphique sérialisé en tant qu'URI d'image. Appelez-le après que le graphique est dessiné. Consultez la page Imprimer des graphiques PNG. Type renvoyé:chaîne
|
getSelection() |
Renvoie un tableau des entités de graphique sélectionnées.
Les entités sélectionnables sont des régions auxquelles une valeur est attribuée.
Pour ce graphique, vous ne pouvez sélectionner qu'une seule entité à la fois.
Type renvoyé:tableau d'éléments de sélection
|
setSelection() |
Sélectionne les entités de graphique spécifiées. Annule toute sélection précédente.
Les entités sélectionnables sont des régions auxquelles une valeur est attribuée.
Pour ce graphique, vous ne pouvez sélectionner qu'une seule entité à la fois.
Return Type (Type renvoyé) : aucun
|
Événements
| Nom | |
|---|---|
error |
Déclenché lorsqu'une erreur se produit lors de la tentative d'affichage du graphique. Propriétés:id, message
|
ready |
Le graphique est prêt pour les appels de méthode externes. Si vous souhaitez interagir avec le graphique et appeler des méthodes après l'avoir dessiné, vous devez configurer un écouteur pour cet événement avant d'appeler la méthode Propriétés:aucune
|
regionClick |
Appelé lorsqu'un utilisateur clique sur une région. Cette erreur ne sera pas générée pour le pays spécifique indiqué dans l'option "région" (si un pays spécifique était répertorié).
Properties (Propriétés) : objet avec une seule propriété,
region, qui est une chaîne au format ISO-3166 décrivant la région sur laquelle l'utilisateur a cliqué.
|
select |
Déclenché lorsque l'utilisateur clique sur une entité visuelle. Pour savoir ce qui a été sélectionné, appelez Propriétés:aucune
|
Règles concernant les données
Les lieux sont géocodés par Google Maps. Les données qui ne nécessitent pas de géocodage ne sont envoyées à aucun serveur. Pour en savoir plus sur les règles relatives aux données, veuillez consulter les Conditions d'utilisation de Google Maps.