向google散点图添加标签 [英] Adding labels to google scatter charts

问题描述

我使用Google图表API绘制散点图，是有一种方法来标记散点图中的每个节点。我想它只使用数值.....任何其他工具，我可以使用。
例如：

I am using google charts API to draw scatter, is there a way to label each node in the scatter diagram. I guess it only uses the numeric values.....Any other tools I can use instead. Example:

Name  Age  Response 
Allen 12    40
Tom   16    45
Sim   17    60

X和y轴将分别为年龄和响应，我可以标记为Allen，Tom，Sim

X and y axis will be age and response respectively, but each node on the graph can I label as Allen, Tom, Sim

推荐答案

您可以通过添加工具提示为Google ScatterChart中的点添加标签。

You can label the points in a Google ScatterChart by adding a tooltip. Tooltips show up when you mouseover a data point.

您的数据表的代码应如下所示：

The code for your data table should look something like this:

var dt = new google.visualization.DataTable(
{
    cols: [{id: 'A', label: 'Age', type: 'number'},
           {id: 'B', label: 'Response', type: 'number'},
           {id: 'C', label: 'Name', type:'tooltip', p:{role:'tooltip'}
          ],
    rows: [{c:[{v: 12}, {v: 40}, {v:'Allen'}]},
           {c:[{v: 16}, {v: 45}, {v:'Tom'}]},
           {c:[{v: 17}, {v: 60}, {v:'Sim'}]}
          ]
 },
 0.6
)

链接到工具提示：
https://developers.google.com/chart/interactive/docs/roles#tooltiprole

链接到DataTable类（用于格式化数据）：
https://developers.google.com/chart/interactive/docs/reference#DataTable

Link to DataTable class (for formatting data): https://developers.google.com/chart/interactive/docs/reference#DataTable

注意：如果您试图绘制多个数据系列，你必须为每一个指定一个工具提示。例如，如果为平均响应添加单独的数据系列，代码将更改为：

NOTE: if you're trying to plot multiple data series, you have to specify a tooltip for each one. For example, if you add a separate data series for Average Response, the code would change to:

var dt = new google.visualization.DataTable(
{
    cols: [{id: 'A', label: 'Age', type: 'number'},
           {id: 'B', label: 'Response', type: 'number'},
           {id: 'C', label: 'Name', type:'tooltip', p:{role:'tooltip'},
           {id: 'D', label: 'AvgResp', type: 'number'},
           {id: 'E', label: 'Category', type:'tooltip', p:{role:'tooltip'}
          ],
    rows: [{c:[{v: 12}, {v: 40}, {v:'Allen'}, {v:null}, {v:null}]},
           {c:[{v: 16}, {v: 45}, {v:'Tom'}, {v:null}, {v:null}]},
           {c:[{v: 17}, {v: 60}, {v:'Sim'}, {v:null}, {v:null}]},
           {c:[{v: 12}, {v: null}, {v:null}, {v: 35}, {v:'Avg. 12yo'}]},
           {c:[{v: 16}, {v: null}, {v:null}, {v: 48}, {v:'Avg. 16yo'}]},
           {c:[{v: 17}, {v: null}, {v:null}, {v: 52}, {v:'Avg. 17yo'}]}
          ]
 },
 0.6
)

这篇关于向google散点图添加标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！