Mit welchem ​​HTML5-Diagrammwerkzeug kann ich Änderungen im Laufe der Zeit mit verschiedenen x-Werten darstellen?

Question

Google bietet eine Charting/Grafik-API und hat eine Grafik, die ich ändern im Laufe der Zeit nutzen möchten zu präsentieren, und das Diagramm/Diagramm wird die „Annotated Timeline“ und ein Beispiel davon ist hier genannt:

Picture.png http://img198.imageshack.us/img198/1160/pictureea.png

Das coolste Feature ist, dass Sie nicht alle "x-Koordinaten" -Punkte mit jedem y-Wert ausgeben müssen, damit die Datenpunkte nicht vertikal ausgerichtet sind. Das ist gut, weil ich Werte nicht für alle Punkte in jedem Zeitintervall:

Picture 1.png http://img843.imageshack.us/img843/5814/picture1ye.png

Diese das Ende meiner Bedürfnisse wären, außer dass ich das nicht ausdrucken können, ohne einen Screenshot zu nehmen weil diese spezielle Google-Visualisierung auf Flash basiert.

Welches Werkzeug kann ich verwenden, um Daten mit verschiedenen x-Werten für die y-Datenpunkte zu plotten, die HTML5-kompatibel/nicht flash sind?

ps: Google bietet auch die line chart api an, aber ich glaube nicht, dass es x-Achsenpunkte bietet, die nicht parallel sind.

Answer 1

Sie können dies mit AmCharts tun. Hier ist ein Beispiel für datumsbasierten Diagramm, auf dem Google-Charts ganz ähnlich aussieht: http://amcharts.com/stock/events/ Ein anderes mit mehreren Linien: http://amcharts.com/javascript/line-chart-with-multiple-value-axes/

Dieses Beispiel hat Datenpunkte bei den gleichen Daten, aber die Tabelle kann Daten anzeigen, wie Sie auch benötigen . Der Datenanbieter sollte alle Daten enthalten, die Sie haben. Es ist jedoch nicht erforderlich, dass das Datenelement Werte für alle Diagramme enthält. Hier sind Beispieldaten:

{date: new Date(2010,1,2), graph1:54, graph2:2}, 
{date: new Date(2010,1,3), graph1:53}, 
{date: new Date(2010,1,4), graph1:55}, 
{date: new Date(2010,1,5), graph2:2} 

Ich hoffe, das hilft. Antanas (Autor von amCharts)

Answer 2

Highcharts hat auch ein irregular time data Beispiel, das dies tun kann:

charts.png http://img269.imageshack.us/img269/8963/chartsf.png