如何使用Google图表API在X轴上使用date?
有没有方法使用Google图表API绘制图表,以便X轴值是一个月内的天数?
我有没有提供相同频率的数据点。 例如:
Date - Value 1/1/2009 - 100 1/5/2009 - 150 1/6/2009 - 165 1/13/2009 - 200 1/20/2009 - 350 1/30/2009 - 500
我想制作一个图表,将每个数据点与基于一个月的时间的相对距离分开。 这可以用Excel来完成,但我怎样才能计算和显示它与谷歌图表?
其他类似于Google图表的免费解决scheme或者可以与ASP.NET一起使用的免费库也是受欢迎的。
更新这现在直接在Chart API中使用高级graphics“带注释的图表”function支持 – https://developers.google.com/chart/interactive/docs/gallery/annotationchart
我已经在我的ReHash数据库统计图表上做了这个(尽pipedate结果是均匀分布的,所以它并不完全certificate它是这样做的)。
首先,你想得到你的总体时间 ,这将是类似于你的图表的整体宽度。 要做到这一点,我们减去最新的date。 我更喜欢使用Unix时代的时间戳,因为它们是整数,并且易于用这种方式进行比较,但是可以很容易地计算秒数等。
现在,循环你的数据。 对于每个date,我们希望在date从一开始(即最早的date是0,最近的是100)的整个周期中的百分位数 。 对于每个date,您首先要计算数据集中最早date的当前date距离。 从本质上讲,“我们从一开始就有多远”。 所以,从当前date减去最早的date。 然后,为了find百分位数,我们将当前date的距离除以整个时间段 ,然后乘以100,并舍去或舍入任意小数,得到我们的整体x坐标 。
就这么简单! 您的x值范围从0(图表的左侧)到100(右侧),并且每个数据点将位于距离其真实时间距离的开始距离处。
如果你有任何问题随时问! 如果需要,我可以发布pesudocode或PHP。
我有同样的问题,发现在谷歌图表散点图 ,它确实是必要的。
这里是我结束的代码(以他们的起点为准):
function drawVisualization() { // Create and populate the data table. var data = new google.visualization.DataTable(); data.addColumn('date', 'Date'); data.addColumn('number', 'Quantity'); data.addRow([new Date(2011, 0, 1), 10]) data.addRow([new Date(2011, 1, 1), 15]) data.addRow([new Date(2011, 3, 1), 40]) data.addRow([new Date(2011, 6, 1), 50]) // Create and draw the visualization. var chart = new google.visualization.ScatterChart( document.getElementById('visualization')); chart.draw(data, {title: 'Test', width: 600, height: 400, vAxis: {title: "cr", titleTextStyle: {color: "green"}}, hAxis: {title: "time", titleTextStyle: {color: "green"}}, lineWidth: 1} ); }
注意它们似乎从0开始算个月,即1月是0,2月是1,…,12月是11。
它看起来像你现在可以用高级图做到这一点:
http://code.google.com/apis/visualization/documentation/gallery/annotatedtimeline.html
这可以用Google图表很容易地完成,但是您的应用程序必须计算标签
chxl图表x标签参数是您需要的。 下面的例子用一个50步的数字来标记一个y轴,最下面的一个是date
chxl=0:|0|50|100|150|200|250|300|350|400|450|500|1:|16/01/2009|26/01/2009|6/02/2009
海。 我正在和你一样思考。 我可以预见标签互相覆盖的问题,只能想到两种方法。
1)根据格式(星期一/星期二,星期一/星期二,1月1日,1月1日,1月1日,2月29日,2010年2月14日)等,计算出每个date有多less个字符,你可以适应整个你的图表宽度(这可能会很粗糙,涉及像素字符宽度(更容易固定字体),或只是几个试验和错误)。
当然,您的标签可能会直接与任何数据alignment。
2)使用多个X轴标签并垂直放置date。