Date objects have millisecond resolution, so you shouldn't have any problem
using them. The only issue I see is that the data arrays have errant
commas at the end (",]"), which will cause problems in some browsers. I
hooked up your code in a jsfiddle and inserted a DateFormatter to format
the dates: http://jsfiddle.net/asgallant/3WqzC/
The problem with using numbers is that you have to set the
"interpolateNulls" option to true in order to get the lines to draw with
empty data sets between points.
I think I may have a better solution, though:
http://jsfiddle.net/asgallant/3WqzC/2/. This avoids the problem with the
interpolation, should have a much lower memory footprint, and requires less
pre-processing of data.
On Friday, April 5, 2013 3:01:39 PM UTC-4, Oliver Smith wrote:
>
>
> Spoke too soon:
>
> Using "Date" seems to be losing me some portion of my millisecond
> fidelity, if I use "number" for the times, instead, I wind up with a blank
> chart. I can mouse over the chart and see that the data points are there,
> but the lines themselves aren't rendered.
>
> Here's the code with a simple "useDate" switch. If you set useDate=1, and
> redraw the graph a few times, you'll see it clearly doesn't like
> millisecond-granularity dates; if you set it to useDate=0, no lines.
>
> var tickTimes = {
>>
>> 1 : { 'color':'#ff0000',
>>> 'ticks':[[-20025,384],[-19586,376],[-19122,392],[-18722,368],[-18287,360],[-17838,377],[-17434,368],[-17020,399],[-16573,381],[-16138,393],[-15735,341],[-15295,363],[-14886,337],[-14455,370],[-14006,401],[-13567,380],[-13162,337],[-12681,445],[-12277,359],[-11874,345],[-11448,360],[-11013,368],[-10600,317],[-10166,423],[-9736,359],[-9280,383],[-8808,425],[-8384,411],[-7934,375],[-7503,341],[-7071,358],[-6624,377],[-6177,362],[-5765,289],[-5359,381],[-4942,381],[-4378,480],[-3906,466],[-3493,394],[-3092,358],[-2642,409],[-2226,371],[-1803,323],[-1402,381],[-1000,368],[-527,414],[-79,422],]},
>>
>> 3 : { 'color':'#ff8000',
>>> 'ticks':[[-19930,21],[-19526,39],[-19121,23],[-18718,36],[-18316,17],[-17914,23],[-17514,19],[-17114,21],[-16711,26],[-16311,21],[-15909,21],[-15509,20],[-15108,39],[-14706,41],[-14304,22],[-13904,25],[-13502,43],[-13102,21],[-12702,34],[-12300,37],[-11896,42],[-11492,23],[-11091,19],[-10689,43],[-10287,26],[-9886,20],[-9486,68],[-9086,30],[-8686,55],[-8286,40],[-7886,18],[-7482,23],[-7081,23],[-6680,43],[-6280,22],[-5879,23],[-5479,36],[-5075,19],[-4675,26],[-4270,36],[-3866,21],[-3465,26],[-3064,53],[-2647,69],[-2247,23],[-1845,41],[-1445,37],[-1042,27],[-639,32],[-239,52],]},
>>
>> 7 : { 'color':'#ffff00',
>>> 'ticks':[[-19847,6],[-19447,7],[-19046,7],[-18642,2],[-18241,7],[-17840,4],[-17440,4],[-17038,4],[-16638,6],[-16234,4],[-15834,2],[-15434,3],[-15034,6],[-14633,21],[-14233,4],[-13833,9],[-13433,21],[-13032,6],[-12632,4],[-12232,10],[-11832,25],[-11431,5],[-11027,2],[-10627,21],[-10227,3],[-9827,2],[-9427,27],[-9027,7],[-8626,4],[-8225,22],[-7824,3],[-7423,3],[-7007,24],[-6607,1],[-6207,0],[-5807,5],[-5407,24],[-5007,5],[-4603,4],[-4202,25],[-3801,1],[-3401,2],[-2998,29],[-2598,7],[-2198,4],[-1798,1],[-1397,42],[-997,1],[-597,11],[-196,25],]},
>>
>> };
>>
>> var useDate = 1;
>>
>>
>>
>> function drawVisualization() {
>>
>> var now = useDate ? (new Date()).getTime() : 0;
>>
>> var rows = {};
>>
>> var colors = [];
>>
>>
>>> // Create a visualization dataset.
>>
>> var data = new google.visualization.DataTable();
>>
>> data.addColumn(useDate ? 'datetime' : 'number', 'Time');
>>
>> for (var t in tickTimes) {
>>
>> var entry = tickTimes[t];
>>
>> entry.col = data.addColumn('number', t);
>>
>> colors[entry.col] = entry.color;
>>
>> }
>>
>>
>>> // Merge the data into a single table indexed by time,
>>
>> // wasteful because the threads are independent so they
>>
>> // are unlikely to tick at the same milisecond, but
>>
>> // required by the charts api.
>>
>> var time;
>>
>> for (var t in tickTimes) {
>>
>> var entry = tickTimes[t];
>>
>> for (var i = 0; i < entry.ticks.length; ++i) {
>>
>> var ticks = entry.ticks[i];
>>
>> if (useDate) {
>>
>> time = new Date();
>>
>> time.setTime(now + ticks[0]);
>>
>> } else {
>>
>> time = now + ticks[0];
>>
>> }
>>
>> if (!(time in rows)) {
>>
>> rows[time] = [time];
>>
>> for(var t in tickTimes) { rows[time].push(null); }
>>
>> }
>>
>> rows[time][entry.col] = ticks[1];
>>
>> }
>>
>> }
>>
>>
>>> // Add the resulting rows into the data table.
>>
>> for (var row in rows) {
>>
>> data.addRow(rows[row]);
>>
>> }
>>
>> rows = [];
>>
>> data.sort(0);
>>
>> new
>>> google.visualization.LineChart(document.getElementById('visualization')).
>>
>> draw(data, {width: 640, height: 480}
>>
>> );
>>
>> }
>>
>>
>>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at
http://groups.google.com/group/google-visualization-api?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
