Флот не загружает JSON

Question

Я новичок в json и flot. Но меня попросили создать диаграмму. Может ли кто-нибудь объяснить мне, почему мой код не работает?

$.getJSON('chart.json', function(graphData){ 
    alert(graphData); 

    $.plot($('#graph-lines'), graphData, { 
     series: { 
      points: { 
       show: true, 
       radius: 15, 

      }, 
      lines: { 
       show: true, 
       lineWidth: 6 

      }, 
      shadowSize: 0 
     }, 
     grid: { 
      color: '#646464', 
      borderColor: 'transparent', 
      borderWidth: 20, 
      hoverable: true, 
      highlightColor: "transparent" 
     }, 
     xaxis: { 
      tickColor: 'transparent', 
      ticks: [[6,'Week 48'],[7,'Week 49'],[8,'Week 50'],[9,'Week 51'],[10,'Week 52']] 
     }, 
     yaxis: { 
      min: 0, 
      max: 1000, 
      tickSize: 500 
     } 
    }); 

    // Bars 
    $.plot($('#graph-bars'), graphData, { 
     series: { 
      bars: { 
       show: true, 
       barWidth: .9, 
       align: 'center' 
      }, 
      shadowSize: 0 
     }, 
     grid: { 
      color: '#646464', 
      borderColor: 'transparent', 
      borderWidth: 20, 
      hoverable: true 
     }, 
     xaxis: { 
      tickColor: 'transparent', 
      tickDecimals: 2 


    }, 
      yaxis: { 
       tickSize: 1000 
      } 
     }); 
}); 

Из того, что я ве узнал, до сих пор является то, что JQuery $.getJSON('chart.json', function(graphData) должен получить файл в формате JSON. и $.plot($('#graph-lines'), graphData,{}) должен разобрать его.

Это мой JSON файл:

{  
    data: [ [6, 520], [7, 600], [8, 850], [9, 900], [10, 300] ], 
    color: '#F02626', 
    points: { fillColor: '#F02626', radius: 6 }, 
    lines: { fillColor: '#CCF8FF'} 
}, { 
    data: [ [6, 300], [7, 400], [8, 550], [9, 750], [10, 200] ], 
    color: '#26F041', 
    points: { radius: 10, fillColor: '#26F041' } 
}, { 
    data: [ [6, 200], [7, 150], [8, 380], [9, 400], [10, 100] ], 
    color: '#20AEFA', 
    points: { radius: 6, fillColor: '#20AEFA'} 
} 

Итак, мне нужно все свойства в формате JSON (данные, цвет и точка), поскольку они замещают по умолчанию и дать каждую линию или бар другого цвета.

Я получил это раньше. У меня был json, написанный внутри .js, но я хочу назвать его из внешнего файла JSON.

Im не ищем ответа «Попробуйте это». Я хотел бы понять, что я делаю неправильно и почему, поэтому я могу узнать, почему он работает так, как он делает.

Заранее спасибо.

Answer 1

это просто файл JSON не является действительным оно должно быть, как это

[ 
    {  
     "data": [ [6, 520], [7, 600], [8, 850], [9, 900], [10, 300] ], 
     "color": "#F02626", 
     "points": { "fillColor": "#F02626", "radius": 6 }, 
     "lines": { "fillColor": "#CCF8FF"} 
    }, 
    { 
     "data": [ [6, 300], [7, 400], [8, 550], [9, 750], [10, 200] ], 
     "color": "#26F041", 
     "points": { "radius": 10, "fillColor": "#26F041" } 
    }, 
    { 
     "data": [ [6, 200], [7, 150], [8, 380], [9, 400], [10, 100] ], 
     "color": "#20AEFA", 
     "points": { "radius": 6, "fillColor": "#20AEFA"} 
    } 
]