Google Chart中的工具提示,同时使用JSON填充图表 [英] Tooltip in Google Chart while populating chart using JSON

查看:72
本文介绍了Google Chart中的工具提示,同时使用JSON填充图表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我现在正在使用JSON填充我的Google图表,但我也需要自定义工具提示。目前我的JSON如下所示:

I am populating my Google chart using JSON currently, but I need to customize tooltips as well. Currently my JSON looks like this:

{
    "cols": [
        {"id": "", "label": "date", "type": "string"},
        {"id": "", "label": "price", "type": "number"}
    ],
    "rows": [
        {"c":[{"v": "Apr 24th","f":null}, {"v": 56000,"f":"56000"}]},
        {"c":[{"v": "May 3rd","f":null}, {"v": 68000,"f":"68000"}]},
        {"c":[{"v": "May 13th","f":null}, {"v": 50400,"f":"50400"}]}
    ]
}

但是,如果我在JSON中也指定了我的工具提示,如下所示:

But if I specify my tooltip in the JSON too like this:

{
    "cols": [
        {"id": "", "label": "Date", "type": "string"},
        {"id": "", "label": "price", "type": "number"},
        {"id": "", "role": "tooltip", "type": "string"}
    ],
    "rows": [
        {"c":[{"v": "Apr 24th","f":"null"}, {"v": 56000,"f":"56000"}, {"v": "24 April, Price - 56000, Seller-abcd"}]},
        {"c":[{"v": "May 3rd","f":"null"}, {"v": 68000,"f":"68000"}, {"v": "3 May, Price - 68000, Seller-abcd"}]},
        {"c":[{"v": "May 13th","f":"null"}, {"v": 50400,"f":"50400"}, {"v": "23 May, Price - 50000, Seller-abcd"}]}
    ]
}

我得到一个错误,相同的数据类型。

I get an error that all values in series should be of same data type.

我的客户端代码如下所示:

My client side code looks like this:

var jsonData = $.ajax({
    url: '../phps/testPhp.php',
    dataType:"json",
    async: false
}).responseText;

var dataTable = new google.visualization.DataTable(jsonData);

var minVal = 50000;
var maxVal = 70000;    

var chart = new google.visualization.LineChart(document.getElementById('chart_div'));

var options = {
    width: 375, height: 240,
    legend: 'none',
    pointSize: 5,
    backgroundColor: 'transparent',
    vAxis: { minValue: 45000, maxValue: 70000 }
};

chart.draw(dataTable, options);

请让我知道是否有人知道解决方案。

Please let me know if someone knows the solution.

推荐答案

工具提示栏定义不明确;应该是这样的:

The tooltip column is badly defined; should be something like :

{"id": "", "role": "tooltip", "type": "string", "p" : { "role" : "tooltip" } }   

这篇关于Google Chart中的工具提示,同时使用JSON填充图表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆