インタラクティブマップに問題がある - Googleマップ、インタラクティブ

Googleを使用しようとしています（失敗しています）。インタラクティブなマップを作成するための視覚化コード。米国の州の上にマウスを移動すると、数値がドル記号を含むようにフォーマットされます。

ここに私のマップコードがあります。誰かが私が間違っていることを教えてください。

function drawVisualization() {
var data = google.visualization.arrayToDataTable([
["State", "Dollars"],
["US-IL", 200],
["US-IN", 300],
["US-AL", 200],
["US-AZ", 800],

]);

var geochart = new google.visualization.GeoChart(
document.getElementById("visualization"));
geochart.draw(data, {width: 556, height: 347, region: "US", resolution: "provinces"});
}

回答：

ホバー状態のデータにドル記号を付けるには、Geochartシステムに特定のプレフィックスでデータをフォーマットするように指示する必要があります。パーセントを設定する必要がある場合は、代わりにパーセント記号の付いたサフィックスを追加できます。以下のGoogle APIドキュメントをご覧ください。

Google APIドキュメント： https://developers.google.com/chart/interactive/docs/reference#numberformatter

あなたの場合、使用するコードの2行は次のとおりです。

// Add the prefix (and set the decimal places)
var formatter = new google.visualization.NumberFormat({prefix: "$", fractionDigits: 0});

// Apply formatter to second column
formatter.format(data, 1);

したがって、コードは次のようになります。

function drawVisualization() {
var data = google.visualization.arrayToDataTable([
["State", "Dollars"],
["US-IL", 200],
["US-IN", 300],
["US-AL", 200],
["US-AZ", 800],
]);


// --- Code to add ---
var formatter = new google.visualization.NumberFormat({prefix: "$", fractionDigits: 0});
formatter.format(data, 1);
// --- End of Code to add ---


var geochart = new google.visualization.GeoChart(
document.getElementById("visualization"));
geochart.draw(data, {width: 556, height: 347, region: "US", resolution: "provinces"});
}