I'm trying to create a dynamic chart using on api .(http://rajman.in/exchange/pricechart)

Posted 1 year ago by coderathore

This is my code please check error in my code.

I want this format json data.

[ {"date": "2011-08-01","open": "136.65","high": "136.96","low": "134.15","close": "136.49"},{"date": "2011-08-05","open": "136.65","high": "136.96","low": "134.15","close": "136.49"} ]

This my code:-

window.onload = function () { var dps = []; //var dps =[ {"date": "2011-08-01","open": "136.65","high": "136.96","low": "134.15","close": "136.49"},{"date": "2011-08-05","open": "136.65","high": "136.96","low": "134.15","close": "136.49"} ]; var chart = AmCharts.makeChart( "chardiv", { "type": "serial", "theme": "light", "dataDateFormat":"YYYY-MM-DD", "valueAxes": [ { "position": "left", "axisColor": "#999", "color": "#999", } ], "graphs": [ { "id": "g1", "proCandlesticks": true, "balloonText": "Open:[[open]]Low:[[low]]High:[[high]]Close:[[close]]", "closeField": "close", "fillColors": "#02c5a5", "highField": "high", "lineColor": "#02c5a5", "lineAlpha": 1, "lowField": "low", "fillAlphas": 0.9, "negativeFillColors": "#dc3545", "negativeLineColor": "#dc3545", "openField": "open", "title": "Price:", "type": "candlestick", "valueField": "close" } ],

"chartScrollbar": { "graph": "g1", "graphType": "line", "scrollbarHeight": 30 }, "chartCursor": { "valueLineEnabled": true, "valueLineBalloonEnabled": true }, "categoryField": "date", "categoryAxis": { "axisColor": "#999", "parseDates": true, "color": "#999", }, "dataProvider": dps, "export": { "enabled": true, "position": "bottom-right" } } ); chart.addListener( "rendered", zoomChart ); zoomChart(); // this method is called when chart is first inited as we listen for "dataUpdated" event function zoomChart() { // different zoom methods can be used - zoomToIndexes, zoomToDates, zoomToCategoryValues chart.zoomToIndexes( chart.dataProvider.length - 50, chart.dataProvider.length - 1 ); }

var dataLength = 30; var updateInterval = 5000; var updateChart = function () { //alert("ok");

$.ajax({ url: "http://rajman.in/exchange/pricechart/", success:function(p){ //alert(p) var parsed = JSON.parse(p);

var arr = []; for(var x in parsed){ arr.push(parsed[x]); }

console.log(p);

for (var i=0; i < arr.length; i++) {

var yu =JSON.parse(arr[i]);

var avg = yu.data.avg; var high = yu.data.high; var low = yu.data.low; var volume = yu.data.volume; var open = yu.data.open; var close = yu.data.close; var date = new Date(); date.setDate(date.getDate() - i);

var date = date.getFullYear()+'-'+ (date.getMonth()+1) +'-'+date.getDate();

//console.log(dateMsg); //console.log(day); //alert(date);

dps.push({ date: date, open: open, high: high, low :low, close:close });

} document.getElementById("pchart").innerHTML = p;

}

}); //chart.render(); };

updateChart(dataLength); setInterval(function(){updateChart()}, updateInterval);

}

Please sign in or create an account to participate in this conversation.