Thursday 15 March 2012

Reading data from CSV with highstock -


At the end of the highstock chart, for three days trying all the methods of loading the data, I have some problems with my code:

>

 1. Date is displayed on Xaxis "2013-04-23 21:07:40" in line;  
  • I have no button "zoom" from end window "" to "" ", sorted days, hours
    1. temperature of the value nearest value example 1 9.44 ->
    2. I do not have a border selector, I want a graph in this site: I am not a good programmer, but I try. I have a similar problem in this forum, but the solution is not working, please help someone. Best regards
       Data in CSV is formatted in such a way: 2013-04- 23 21: 07: 40,19.44 2013-04-23 21:30 30,50,19.38 2013-04-22 23: 11: 11,19.6 9 2013-04-23 22:45 45: 02,19.44 2013-04-23 23: 00: 03.19.75 2013-04-23 23:45 45: 03,19.19 2013-04-24 00: 00: 12,19.13 2013-04-24 00: 45: 03,19  

      My HTML code & lt ;! DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // N" "http://www.w3.org/TR/html4/strict.dtd"> & Lt; Html & gt; & Lt; Top & gt; & Lt; Meta http-equiv = "content-type" content = "text / html; charset = UTF-8" & gt; & Lt; Title & gt; Test & lt; / Title & gt; & Lt; Script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type = "text / javascript" & gt; & Lt; / Script & gt; & Lt; Script type = "text / javascript" & gt; $ (Document) .ready (function () {var c = []; var d = []; // a timer var start = + create new date (); var option = {chart: {events: {load: function (Chart) {type: 'chart created on', '{text:' (new date () - start) + 'ms'});}}, render:' chart ', type the default series:' Line, zoom type: 'x'}, category selector: {button: [{type: 'day', count: 3, text: '3d'}, {type: 'week', count: 1, text: 'Type': 'year', count: 1, text: '1m'}, {type: 'month', count: 6, text: '6m'}, {type: 'year' Count: 1, lesson Title: 'all', text: 'all'}], selected: 3}, headline: {text: 'Temporary temperature in the room'}, subtitles: {text: 'Built chart at .. '.', 'Exclamation of Dynamic Text'), Exxis: {Title: {Text: 'Date Measurement'}, Categories: C}, yAxis: {title: {text: 'Temperature (degree Celsius)}} }, Series: [{Name: 'temperature', data: D, tooltip: {valueDecimals: 2, valueSuffix: '° C'}}]}; $ .get ('dane.csv', function) {Var lines = data.split ('\ N'); $ .eich (L Ines, function (line, line) {var items = line.split (','); c.push (item [0]); d.push (parseInt (item [1]);} Var charts = new highchartes. Chart (option); }); }); & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Script src = "highstock.js" type = "text / javascript" & gt; & Lt; / Script & gt; & Lt; Script src = "exporting.js" type = "text / javascript" & gt; & Lt; / Script & gt; & Lt; Div id = "chart" style = "height: 500px; minute-width: 500px" & gt; & Lt; / Div & gt; & Lt; / Body & gt; & Lt; / Html & gt;

      High charts use timestamps (time in milliseconds), so that you have your data Need to parse or use date.UTC () function

      Article about preprocessing:

  • No comments:

    Post a Comment