Frage

Ich stecke fest!

Ich muss Highchart mit JSON -Ergebnis erstellen. Ich habe hier einige Quellen gefunden, kann aber nicht funktionieren.

Das Nächste, was ich bekommen kann, war dies:

Diagrammoptionen:

var options = {
    chart: {
        renderTo: 'tudo',
        defaultSeriesType: 'column',
        rightMargin: 80
    },

    title: {
        text: 'Weekdays'
    },
    subtitle: {
        text: 'Source: somewhere in a calendar'
    },

     xAxis: {
        labels: {
            enabled: false
    }
    },

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

    series: []
};

Ajax Call:

$.getJSON('ajax/calc.ajax.php', function(data) {

        var series = [];

        $.each(data, function(key, value) {

            series.name = key;
            series.data = value;

            options.series.push(name);
        });

        var chart = new Highcharts.Chart(options);  
});

Highchart -Ladungen in Ordnung und füllt die Serie mit Series 1, Series 2 ....

Aber es wird keine Grafik gemacht, er bleibt leer. ( etwas wie das: Demo).

Ich möchte wissen, ob ich etwas oder alles fehlt.

Vielen Dank

UPDATE: Ich ändere die SQL, jetzt arbeite ich mit 2 Feldern und damit ist die Grafik perfekt, jetzt möchte ich nur wissen, ob es so ist, dass es in Ordnung ist.

header('Content-Type: application/json');

        while(!$res->EOF){

            //$json = array("group" => "Web", "action" => "list");
            $json[$res->fields["DESMAR"]] = array(intval($res->fields["QTD"]));
            //$json["users"] = array(array("name" => "JulioGreff", "status" => "online"));
            $res->MoveNext();
        }

        echo json_encode($json);
War es hilfreich?

Lösung

In deiner Ajax Call -

$.getJSON('ajax/calc.ajax.php', function(data) {
    var series = []; // <---------------------- must be object not array
    $.each(data, function(key, value) {
        series.name = key;
        series.data = value;
        options.series.push(name); // <-------- it should be series not name
    });
    var chart = new Highcharts.Chart(options);  
});

Also wäre es wie folgt - -

$.getJSON('ajax/calc.ajax.php', function(data) {        
    $.each(data, function(key, value) {
        var series = {}; // <-------------------- moved and changed to object
        series.name = key;
        series.data = value;
        options.series.push(series); // <-------- pushing series object
    });
    var chart = new Highcharts.Chart(options);  
});

In Anbetracht des JSON, den Sie erhalten -

{"nome": "Transformador 250va 0-230-380V / 0,24V-0-48V", "Modello": "Transformador", "Marca": "Seit", "Valor": "318.87 | 542.08", " qtdade ":" 0 "??}

Was du in der machst $.each -

series.data = value;

macht keinen Sinn.

Serie.Data ist ein Array. Es könnte also so aussehen wie entweder folgendermaßen -

[y1, y2, y3, ....] // array of numbers (which are y values)

oder folgendermaßen -

[[x1, y1], [x2, y2], [x3, y3], ....] // array of arrays of pair of numbers (x and y values)

oder folgendermaßen -

// array of objects which can have x and y values as properties
[{                       
    name: 'Point 1',
    color: '#00FF00',
    y: 0
}, {
    name: 'Point 2',
    color: '#FF00FF',
    y: 5
}]

Stellen Sie also sicher, dass Ihr PHP -Code einen JSON erzeugt series.data = value in deinem $.each wird funktionieren.

Aktualisieren:Tut mir leid, ich mache Java und habe nie PHP gemacht, also kann Ihnen bei PHP nicht viel helfen. Aber können Sie es mit Folgendes als Php versuchen, um zu sehen, ob das Diagramm angezeigt wird?

header('Content-Type: application/json');
$return_data = array(
    array(array(10, 20), array(20, 30), array(56, 30), array(50, 20)),
    array(array(10, 0), array(20, 10), array(56, 100), array(50, 40))
);
echo json_encode($return_data);

Aktualisieren: Kuchen rendern und gleichzeitig den gleichen PHP behalten.

$.getJSON('ajax/calc.ajax.php', function(data) {        
    var series = { // <-------------------- create just one series object
        type: 'pie',
        data: [] //data array for new series
    }; 
    $.each(data, function(key, value) {
        series.data.push([key, value[0]]);            
    });
    options.series.push(series); // <-------- pushing series object
    var chart = new Highcharts.Chart(options);  
});

Dies sollte Kreisdiagramm zeichnen.

Andere Tipps

Es sieht so aus, als ob das Problem in Ihrem PHP -Code liegt. Highcharts erwartet eine Serie, die folgen wird ein bestimmtes Format. In Ihrem Fall funktionieren die Dinge (teilweise), weil name ist einer der Feld, nach dem es sucht. Die Daten müssen jedoch in einem von drei Formaten sein:

  • Ein Array von Y -Werten (z. B. zB [0, 1, 2])
  • Ein Array von Arrays (x, y Werte; z. [[0,0], [1,1], [2,2]])
  • Eine Reihe von Objekten, die sich treffen Punkteigenschaften

Sie würden das letzte Format wollen, denke ich. Zum Beispiel:

var series = [];
series.name = "series1";
series.data = {y: 10}; //very minimalistic example of the object format
options.series.push(name);

Um Ihren Code zum Laufen zu bringen, müssen Sie möglicherweise das Innere Ihres ändern $.each Funktion zu so etwas:

$.each(data, function(key, value) {
    series.name = key;

    series.data = {
        y: value.property_you_are_interested_in
    };

    options.series.push(name);
});

... Natürlich wäre es auch ziemlich einfach, wenn Sie eines der anderen Formen verwenden möchten:

//First form (array of y values)
var series = {};
series.data = [];
$.each(data, function(key, value) {
    series.name = key;
    series.data.push(value.property_you_are_interested_in);
});
options.series.push(series);

//Second form (array of x, y values)
var series = {};
series.data = [];
$.each(data, function(key, value) {
    series.name = key;
    series.data.push([value.X_property_you_are_interested_in, value.Y_property_you_are_interested_in]);
});
options.series.push(series);
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top