Загрузите диаграмму высоких диаграмм с json-файлом

Question

Я пытаюсь загрузить граф внутри моей функции document.ready после вызова ajax.

JSON генерируется с помощью PHP и результат заключается в следующем:

[{ "Имя": "коштовного", "данные": [[ "5,50", "2013-07-01 13:50: 00 "], [" 6,50" , "2013-07-05 11:04:00"]]}]

Я пытаюсь построить график части данных в формате JSON, используя этот код:

var options = { 
chart: { 
     renderTo: 'graphContainer', 
    defaultSeriesType: 'line', 
    marginRight: 130, 
    marginBottom: 25 
}, 

title: { 
    text: 'Registro de Precios', 
    x: -20 //center 
}, 
    subtitle: { 
    text: 'Producto: '+nombreProducto, 
    x: -20 //center 
}, 

xAxis: { 
    labels: { 
     enabled: false 
    }, 
    title: { 
    text: 'Fecha' 
    } 
}, 

yAxis: [ 
    { 
    min: 0, 
    title: { 
     text: 'Precio' 
    } 
    }, 
    { 
    linkedTo: 0, 
     opposite: true 
    } 
], 

legend: { 
    layout: 'vertical', 
    align: 'right', 
    verticalAlign: 'top', 
    x: -10, 
    y: 100, 
    borderWidth: 0 
}, 

series: [] 
}; 
$jDatepicker.getJSON('graficasDatos.php?idTienda='+idTienda+'&idProducto='+idProducto, function(data) {   

    $jDatepicker.each(data, function(key, value) { 
var series = {}; 
$jDatepicker.each(value, function(key,val) { 
    if(key == 'name') 
    { 
    series.name = val; 
    } 
    else{ 
    var datos; 
    $jDatepicker.each(val, function(key,val) { 
     datos = val; 
     var x = datos[1]; 
     var y = datos[0]; 
     series.data = [x,y]; 
     options.series.push(series); 
    }); 
    } 
}); 
}); 
var chart = new Highcharts.Chart(options); 

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

Answer 1

Даты должны быть отметками времени (время в миллисекундах), а значения должны быть числом, а не строкой.

Answer 2

решаемых

Я был в состоянии заставить его работать, я просто должен был изменить подход.

Я изменил JSON, чтобы получить это:

[{ "строк": [{ "Precio": "5.50", "Fecha": "2013-07-01"}, { "Precio": "6,50", "Fecha": "2013-07-05"}], "Fechas": [{ "Fecha": "2013-07-01"}, { "Fecha": "2013-07-05"} ], "имя": "Precio"}]

И это обновленный код:

var chart = new Highcharts.Chart({ 
chart: { 
    renderTo: 'graphContainer', 
    showAxes: true, 
    borderWidth: 1 
}, 
title: {      
     text: 'Precios registrados del producto' 
}, 
credits: { 
    text: 'GTSF' 
}, 
xAxis: { 
    type: 'datetime', 
    title: { 
    text: 'Fecha', 
    align: 'high' 
    }, 
    labels: { 
    rotation: -45, 
    align : 'center', 
    y: 40, 
    x: -20 
    }, 
    categories: [] 
}, 
yAxis: { 
    title: { 
    text: 'Precio ($)' 
    } 
}, 
plotOptions: { 
    line: { 
    allowPointSelect: true 
    } 
} 
}); 

// Kick off the loading screen 
chart.showLoading("Obteniendo precios de producto "+ nombreProducto +" ...."); 

$jDatepicker.getJSON('graficasDatos.php?idTienda='+idTienda+'&idProducto='+idProducto, function(stockData) {   

    // Construct series data and add the series 
var seriesData = []; 
var categoriesArray = []; 

    $jDatepicker.each(stockData[0].rows, function(idx, data) { 
    precio = parseFloat(data.precio); 
    seriesData.push([ data.fecha, precio ]); 
}); 

$jDatepicker.each(stockData[0].fechas, function(idx, data) { 
    categoriesArray.push(data.fecha); 
}); 

var seriesOpts = { 
    name: stockData[0].name, 
    data: seriesData, 
    // This is to stop Highcharts rotating the color 
    // for the series 
    color: chart.options.colors[0], 
    marker: { 
     symbol: chart.options.symbols[0] 
    } 
} 

chart.options.xAxis.categories = categoriesArray; 

chart.hideLoading(); 
chart.addSeries(seriesOpts, false); 
//chart.addAxis(axisOpts, true); 
chart.redraw(); 
}); 

Я надеюсь, что это может помочь кому-то: D