Tag: google visualization

谷歌饼图 – onclick问题

我正在创建像这样的谷歌饼图 var totrefuelList=[{“veId”:220,”trName”:”Bus 04″,”totamt”:2,”toqt”:10.0},{“veId”:384,”trName”:”KL 20 B 3966″,”totamt”:0,”toqt”:430.00},{“veId”:385,”trName”:”KL 20 7511″,”totamt”:0,”toqt”:0.0},{“veId”:386,”trName”:”KL 20 D 7426″,”totamt”:0,”toqt”:0.0},{“veId”:387,”trName”:”KL 20 C 3985″,”totamt”:0,”toqt”:190.0},{“veId”:388,”trName”:”KL 01 AM 8356″,”totamt”:0,”toqt”:90.0},{“veId”:389,”trName”:”KL 01 C 8247″,”totamt”:0,”toqt”:234.0},{“veId”:390,”trName”:”KL 01 X 4435″,”totamt”:0,”toqt”:678.0},{“veId”:391,”trName”:”KL”,”totamt”:768,”toqt”:0.0},{“veId”:392,”trName”:”KL 20 B 7544″,”totamt”:0,”toqt”:67.0},{“veId”:393,”trName”:”KL”,”totamt”:0,”toqt”:0.0},{“veId”:394,”trName”:”KL”,”totamt”:0,”toqt”:460.0},{“veId”:395,”trName”:”KL”,”totamt”:0,”toqt”:56.0},{“veId”:396,”trName”:”KL”,”totamt”:0,”toqt”:78.0},{“veId”:397,”trName”:”KL”,”totamt”:0,”toqt”:890.0},{“veId”:399,”trName”:”KL”,”totamt”:70,”toqt”:88.0},{“veId”:400,”trName”:”KL 20 B 5478″,”totamt”:0,”toqt”:768.0},{“veId”:401,”trName”:”KL 01 D 6795″,”totamt”:0,”toqt”:760.0},{“veId”:402,”trName”:”KL”,”totamt”:0,”toqt”:0.0},{“veId”:403,”trName”:”KL 20 B 3968″,”totamt”:0,”toqt”:776.0},{“veId”:398,”trName”:”KL”,”totamt”:1,”toqt”:329.72972972972974}]; function drawchartfromRefuel() { alert(“RefuelLength”+totrefuelList.length); alert(“veId:”+totrefuelList[0].veId); var data = new google.visualization.DataTable(); data.addColumn(‘string’, ‘Task’); data.addColumn(‘number’, ”); data.addRows(totrefuelList.length); for (var i=0;i<totrefuelList.length;i++) { […]

谷歌图表垂直轴和工具提示值格式

我有一个谷歌图表,显示我房间的压力值。 图表中有几个问题 垂直轴重复其值,比如我需要垂直值为95535 95537 95539.但我得到的是95K 95K 95K作为轴值 将鼠标hover在线上时的工具提示具有相同的效果 当我添加代码以使我的点更大(pointSize),甚至没有任何影响 然而,图表行似乎是正确的,因为我认为它有一些起伏。 我添加了NumberFormat格式化程序,但我做的图表并没有改变。 如何正确格式化vAxis和工具提示? 这是我正在使用的代码 google.load(‘visualization’, ‘1.1’, {packages: [‘line’]}); google.setOnLoadCallback(drawChart); function drawChart() { var data = new google.visualization.DataTable(); data.addColumn(‘datetime’, ‘Timestamp’); data.addColumn(‘number’, ‘pressure’); data.addRows([ [new Date(‘2015-11-19 18:26:05’),95245],[new Date(‘2015-11-19 18:19:07’),95186],[new Date(‘2015-11-19 18:19:06’),95186],[new Date(‘2015-11-19 18:12:05’),95152],[new Date(‘2015-11-19 18:05:53’),95151],[new Date(‘2015-11-19 17:58:04’),95172],[new Date(‘2015-11-19 17:51:04’),95152],[new Date(‘2015-11-19 17:44:04’),95141],[new Date(‘2015-11-19 17:37:04’),95111],[new Date(‘2015-11-19 17:30:04’),95102],[new Date(‘2015-11-19 17:26:04’),95112],[new Date(‘2015-11-19 […]

谷歌LineChart:线图问题可能在一个图表中组合3个数据arrays?

我需要图形看起来像这样的方式x轴产品名称1 X轴:日期2. y轴:成本3.线点应该是产品名称 google.charts.load(‘current’, { packages: [‘corechart’] }).then(function () { var charts = {}; var options = { Column: { chartArea: { height: ‘100%’, width: ‘100%’, top: 24, left: 64, right: 32, bottom: 48, }, tooltip: { valueDecimals: 2, valueSuffix: ‘ USD’, valuePrefix: ‘$’ }, ‘vAxis’: { title: ‘Cost in USD ($)’, format:’$#’, }, height: […]

谷歌图表:“未捕获(承诺)错误:未知标题类型:4.7278”错误

我试图通过谷歌图表显示货币汇率的折线图。 基本上我有两种类型的值: 日期(格式iso8601) 费率(十进制数) 当我试图渲染图表时,我收到一个错误:“未捕获(在承诺中)错误:未知标题类型:4.7278” 这是我的代码: PHP数组制作: $xml=simplexml_load_file(‘https://www.ecb.europa.eu/stats/policy_and_exchange_rates/euro_reference_exchange_rates/html/usd.xml’) or die(“Error: Cannot create object”); $arrayForChart[] = [“Date”,”Rate”]; foreach ($xml->DataSet->Series->Obs as $key => $value) { $dateIso8601Format=(string)$value[‘TIME_PERIOD’]; $rateForDate=(string)$value[‘OBS_VALUE’][0]; $rateForDate=(float)$rateForDate; $arrayForChart[] = [$dateIso8601Format,$rateForDate]; } $arrayForChart = json_encode($arrayForChart); 使用Javascript var arrayForChart; $.ajax({ type: “POST”, url: ajaxUrl, //data: {configuration: Config }, success: function (data) { arrayForChart = data; arrayForChart = $.map(arrayForChart, […]

使用javascript将行添加到datatable

我们正在使用Google表格图表,在$(“#loginsubmit”)函数中,我循环访问webservice以获取id , firstName和lastName 。 现在我想添加DataTable中的所有值[每个id一行],这是在drawTable函数中。 我该怎么做? 任何帮助都是有意义的。 $(“#loginsubmit”).live(“click”, function () { for (var i = 58; i < 63; i++) { var request = new Request(); request.service = "http://88.80.223.163:8080/lumiin-service/lumiin/control/communication/" + i; RequestHandler(request, drawTable); } }); function drawTable(data) { //alert(JSON.stringify(data.contents.id) + 'Eshan'); var datat = new google.visualization.DataTable(); //alert(a); datat.addColumn('string', 'Id'); datat.addColumn('string', 'First Name'); datat.addColumn('string', 'Last Name'); […]

选择外部点击事件谷歌图表上的散点图点

我有一个包含john和smith的外部ul li列表,这个列表不是散点图的一部分(这里没有定义html代码) 。 当用户单击john或smith时,应选择散点图的相关点,并将其颜色从蓝色更改为红色。 其次我使用google.visualization.events.addListener(scatterChart,’select’,tableSelectHandler); 改变点颜色,但它的颜色没有改变。 这两种情况有没有解决方案? 我使用以下代码。 var jsonData = ‘[[{“type”:”number”,”label”:”row”},{“type”:”string”,”label”:”Screen Name”},{“type”:”number”,”label”: “Followers Count”},{“type”:”number”,”label”:”Following Count”},{“type”:”datetime”,”label”:”Date”}],[1,”john”,215,263,”Date(2016,1,10,17,07,38)”],[1,”smith”,315,363,”Date(2016,1,10,18,07,38)”]]’; var data = google.visualization.arrayToDataTable(jQuery.parseJSON(jsonData)); // Create a dashboard. var dashboard = new google.visualization.Dashboard( document.getElementById(‘dashboard_div’)); // Create a range slider, passing some options var donutRangeSlider = new google.visualization.ControlWrapper({ ‘controlType’: ‘NumberRangeFilter’, ‘containerId’: ‘filter_div’, ‘options’: { ‘width’: “100%”, ‘filterColumnLabel’: ‘row’, ‘minValue’: 1, […]

GoogleChart不在MVC中工作

我想用数据库中的数据创建一个Google图表。 我有一个返回Json数据的动作,如下所示: [{“Day”:1,”Value”:0.07,”Target”:0.82},{“Day”:2,”Value”:1.00,”Target”:0.82},{“Day”:3,”Value”:0.48,”Target”:0.82},{“Day”:4,”Value”:0.63,”Target”:0.82},{“Day”:5,”Value”:0.81,”Target”:0.82},{“Day”:6,”Value”:0.18,”Target”:0.82},{“Day”:7,”Value”:0.67,”Target”:0.82},{“Day”:8,”Value”:0.70,”Target”:0.82},{“Day”:9,”Value”:0.29,”Target”:0.82},{“Day”:10,”Value”:0.47,”Target”:0.82},{“Day”:11,”Value”:0.03,”Target”:0.82},{“Day”:12,”Value”:0.67,”Target”:0.82},{“Day”:13,”Value”:0.54,”Target”:0.82},{“Day”:14,”Value”:0.32,”Target”:0.82},{“Day”:15,”Value”:0.66,”Target”:0.82},{“Day”:16,”Value”:0.22,”Target”:0.82},{“Day”:17,”Value”:0.86,”Target”:0.82},{“Day”:18,”Value”:0.53,”Target”:0.82},{“Day”:19,”Value”:0.12,”Target”:0.82},{“Day”:20,”Value”:0.48,”Target”:0.82},{“Day”:21,”Value”:0.56,”Target”:0.82},{“Day”:22,”Value”:0.32,”Target”:0.82},{“Day”:23,”Value”:0.70,”Target”:0.82},{“Day”:24,”Value”:0.48,”Target”:0.82},{“Day”:25,”Value”:0.64,”Target”:0.82},{“Day”:26,”Value”:0.20,”Target”:0.82},{“Day”:27,”Value”:0.02,”Target”:0.82},{“Day”:28,”Value”:0.24,”Target”:0.82},{“Day”:29,”Value”:0.65,”Target”:0.82}] 我有这个PartialView: var chartData; google.load(‘visualization’, ‘1.0’, { ‘packages’: [‘corechart’] }); google.charts.setOnLoadCallback(drawVisualization); $.ajax({ url: ‘@Url.Action(“GetDataGoogleChart”, “Charts”)’, dataType: “json”, type: “POST”, contentType: “application/json,chartset=utf-8”, cache: false, success: function(data) { chartData = data.d; }, error: function() { alert(“Error loading data! Please try again.”); } }).done(function() { google.setOnLoadCallback(drawVisualization); drawVisualization(); }); function drawVisualization() { var data = google.visualization.arrayToDataTable(chartData); var […]

Java脚本谷歌饼图:如果没有要显示的数据,则显示一个空饼图

我目前在谷歌饼图上遇到了一些问题。 我有一个饼图,它最终正在工作,并向我显示饼图中的数据。 我现在的问题是,当饼图中没有数据显示时,什么都不会出现。 如果没有要显示的数据,我想显示一个空饼图。 作为替代方案,我也想总是显示一个空的饼图,然后让饼图动态加载饼图中的数据,所以我可以看到它发生。 希望你们能帮助我! 对此,我真的非常感激。 我目前有以下javascript :(更新版本) google.charts.load(‘current’, {packages: [‘corechart’]}); google.charts.setOnLoadCallback(drawChart); var highRiskCategory1 = 0; var mediumHighRiskCategory1 = 0; var mediumRiskCategory1 = 0; var mediumLowRiskCategory1 = 0; var lowRiskCategory1 = 0; var xmlURL = “”; var xml; var firstDraw = true; // load google first google.charts.load(‘current’, { callback: function () { // draw […]

谷歌图表,将dataTable行追加到其他dataTable

我有2个google.visualization.DataTable(数据) 我想将1个dataTable的行追加到另一个dataTable。 我怎么做? 示例表1: 1 | test1 | 20 2 | test2 | 三十 示例表2: 3 | test3 | 60 4 | test4 | 40 我想将2合并为: 1 | test1 | 20 2 | test2 | 三十 3 | test3 | 60 4 | test4 | 40 google.charts.load(‘current’, { callback: drawChart, packages:[‘table’] }); var json1 = […]

合并2谷歌图表dataTables为1

我有2个谷歌图表dataTables,我想合并到1谷歌图表dataTable。 示例表1: 1 | test1 | 20 2 | test2 | 三十 示例表2: 1 | test1 | 20 3 | test3 | 60 我想将2合并为: 1 | test1 | 20 2 | test2 | 三十 3 | test3 | 60 最好的方法是什么? 我的代码现在不合并它们,只是添加行和列。 docs: https : //developers.google.com/chart/interactive/docs/reference#join oldjson = ‘ { “cols”: [ {“id”:””,”label”:”Topping”,”pattern”:””,”type”:”string”}, {“id”:””,”label”:”Slices”,”pattern”:””,”type”:”number”} ], “rows”: […]