1
Google chart APIを使用した共同チャートがあります。ここでは、チャートのツールチップを更新したいと思います。Googleグラフ:toopl tipを変更する
これらのチャートには重複が多いため、実際に各離散点にマウスを乗せてデータを見ることができない場合があります。
Google chart APIを使用した共同チャートがあります。ここでは、チャートのツールチップを更新したいと思います。Googleグラフ:toopl tipを変更する
これらのチャートには重複が多いため、実際に各離散点にマウスを乗せてデータを見ることができない場合があります。
あなたは...
は、次のスニペットを参照してください、その行のツールチップを構築し、計算列
を提供するために、
var dataView = new google.visualization.DataView(joinedData);
dataView.setColumns([0, 1, {
calc: function (dt, row) {
return getTooltip(dt, row);
},
role: 'tooltip',
type: 'string',
p: {
html: true
}
}, 2, {
calc: function (dt, row) {
return getTooltip(dt, row);
},
role: 'tooltip',
type: 'string',
p: {
html: true
}
}]);
function getTooltip(dt, row) {
var tooltip = '<div class="tooltip">';
tooltip += '<div>' + dt.getFormattedValue(row, 0) + '</div>';
tooltip += '<div>' + dt.getColumnLabel(1) + '</div>';
if (dt.getValue(row, 1) === null) {
tooltip += '<div>' + dt.getFormattedValue(row + 1, 1) + '</div>';
} else {
tooltip += '<div>' + dt.getFormattedValue(row, 1) + '</div>';
}
tooltip += '<div>' + dt.getColumnLabel(2) + '</div>';
if (dt.getValue(row, 2) === null) {
if (row > 0) {
tooltip += '<div>' + dt.getFormattedValue(row - 1, 2) + '</div>';
}
} else {
tooltip += '<div>' + dt.getFormattedValue(row, 2) + '</div>';
}
tooltip += '</div>';
return tooltip;
}
フルスニペットDataView
を使用することができます - >http://jsfiddle.net/sqdfrf8f/1/
ノート:チャートはそうhtml
プロパティは周りの作業は、データビューのメソッドを使用することです
を設定しませんデータビュー
上の列のプロパティを尊重しないであろうという点で、バグのいくつかの並べ替え、
がある - >toDataTable()
また
:Googleのチャートに更新ライブラリを使用する必要性を参照してください - ここにポストされたデータの行が互い違いになっている>update library loader code
を、コメントではありませんからフィドルの場合で、調整するなど、必要はありません行インデックス、このアップデートを見る - > [http://jsfiddle.net/sqdfrf8f/5/] (http://jsfiddle.net/sqdfrf8f/5/) – WhiteHat