How to extract data fron json to javascript highchart?

烂漫一生 提交于 2019-12-20 07:35:23

问题


this is part of my json file and the data contain this useless symbol ''\'' ...:

    "{\"0\":{\"index\":23,\"indicator\":\"ClassC Time\",\"month\":201611,\"ww\":201648,\"test_time\":0.0,\"p\":48.0,\"Product\":\"RB\"},\"1\":{\"index\":24,\"indicator\":\"ClassC\",\"month\":201612,\"ww\":201649,\"test_time\":47.48,\"p\":48.0,\"Product\":\"RB\"}

below is my javascript code to create highchart:

<script type='text/javascript'>
$(document).ready(function() {
var options = {
  chart: {type: 'line',height: 250,},
  title: {text: 'Sky'},
  subtitle: {text: 'May 11, 2016'},
  xAxis: {categories: ['9:30 am', '10:00 am', '10:30 am', '11:00am', '11:30 am', '12:00 pm','12:30 pm', '1:00 pm', '1:30 pm', '2:00 pm', '2:30 pm','3:00 pm', '3:30 pm', '4:00 pm'],
  labels: {step: 3}},
  legend: {enabled: false},
  series: [{
    name: 'Nasdaq',
    color: '#4572A7',
    data: [2606.01, 2622.08, 2636.03, 2637.78, 2639.15, 2637.09,
      2633.38, 2632.23, 2632.33, 2632.59, 2630.34, 2626.89, 2624.59, 2615.98
    ]}]};$('#container').highcharts(options);});</script>

How can get used $getJSON to include in my javascript? I try to follow highcharts get data by JSON? but I dunno why my html page is a blank page, not able see any chart...


回答1:


Try this in you browser control you can see the parsed result then use it in you project

JSON.parse("{\"0\":{\"index\":23,\"indicator\":\"ClassC Time\",\"month\":201611,\"ww\":201648,\"test_time\":0.0,\"p\":48.0,\"Product\":\"RB\"},\"1\":{\"index\":24,\"indicator\":\"ClassC\",\"month\":201612,\"ww\":201649,\"test_time\":47.48,\"p\":48.0,\"Product\":\"RB\"}}")



回答2:


Js fiddle example

Add your JSON file in series

             Highcharts.chart('container', {

          title: {
              text: 'Solar Employment Growth by Sector, 2010-2016'
          },

          subtitle: {
              text: 'Source: thesolarfoundation.com'
          },

          yAxis: {
              title: {
                  text: 'Number of Employees'
              }
          },
          legend: {
              layout: 'vertical',
              align: 'right',
              verticalAlign: 'middle'
          },

          plotOptions: {
              series: {
                  pointStart: 2010
              }
          },

          series: [{
              name: 'Installation',
              data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
          }, {
              name: 'Manufacturing',
              data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]
          }, {
              name: 'Sales & Distribution',
              data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387]
          }, {
              name: 'Project Development',
              data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227]
          }, {
              name: 'Other',
              data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]
          }]

      });


来源:https://stackoverflow.com/questions/43749836/how-to-extract-data-fron-json-to-javascript-highchart

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!