javascript - Render Table jQuery weird load order -
i'm pulling data json file jquery.
i trying create table data. works second piece of code rendering highcharts graph uses latter table create graph.
here i'm using render table (it's not pretty):
$.getjson('data.json', function(data) { var items = []; $('.contn').append("<table id='datatable'>"); $('.contn').append("<thead><tr><th></th> <th>take</th> <th>accrue</th></tr></thead><tbody>"); $.each(data.wlc_lieu_time, function(key, val) { $('.contn').append("<tr><th>" + val.month + "</th><td>"+ val.take + "</td><td>" + val.accrue + "</td></tr>"); }) $('.contn').append("</tbody></table>"); });
then render graph:
$('#container').highcharts({ data: { table: document.getelementbyid('datatable') }, chart: { type: 'line' }, title: { text: 'data extracted html table in page' }, yaxis: { allowdecimals: false, title: { text: 'units' } }, tooltip: { formatter: function () { return '<b>' + this.series.name + '</b><br/>' + this.point.y + ' ' + this.point.name.tolowercase(); } } });
firstly, chart doesn't pick on table i'm presuming load order. how can make sure table created before chart looks table?
here official documentation highcharts w/ pulling data table generate graph can found here
maybe because you're using ajax data, highcharts method called before data.json loaded. should wait until getjson complete before trying render chart.
Comments
Post a Comment