Невозможно построить 2 отдельных графика, используя FlotJs - PullRequest
Новая
       21

Невозможно построить 2 отдельных графика, используя FlotJs

0 голосов
/ 24 апреля 2019

Я пытаюсь построить 2 отдельных графика (на самом деле это будет 9, но на данный момент их только 2), используя flotJS, так или иначе данные смешивают и отображают одинаковые смешанные данные на обоих графиках

Вот мой код JS: 

var graphData1, graphData2, graphData3 = [];
var graphBuffer = 1000;
var xmin = 0;
var xmax = 5;

var options = {
    xaxes: [
        {position: 'bottom', autoScale: 'none', min: 0, max: 5}
    ],
    yaxes: [
        {position: 'left', autoScale: 'none', min: -1.5, max: 1.5}
    ],
    zoom: {interactive: true},
    pan: {interactive: true}
};


function deleteGraph() {
    graphData1 = graphData2 = graphData3 = [];

    $.plot("#graph1", [{graphData1}], options);
    $.plot("#graph2", [{graphData2}], options);
    //$.plot("#graph3", [{graphData3}], options);
}

function updateGraph(data) {

    var datatmp = data.data;

    // Formatea y Almacena datos a graficar
    datatmp.forEach(function (sample) {
        graphData1.push([parseFloat(sample.timestamp.toFixed(4)), parseFloat(sample.sensor1.toFixed(4))]);
        //graphData2.push([parseFloat(sample.timestamp.toFixed(4)), parseFloat(sample.sensor2.toFixed(4))]);
    });

    $.plot("#graph1", [graphData1], options);
    $.plot("#graph2", [graphData2], options);

}

и с этим кодом вывод:

graph result 1

Как видно, на обоих графиках изображена одна и та же информация, даже когда //graphData2.push([parseFloat(sample.timestamp.toFixed(4)), parseFloat(sample.sensor2.toFixed(4))]); прокомментирован

Однако, если я удалю комментарий, результат будет следующим:

graph result 2

Как вы можете видеть, это смешивает данные и отображает одинаковые смешанные данные на обоих графиках

Как я могу отобразить разные данные на разных графиках?

Спасибо за вашу помощь ...

1 Ответ

1 голос
/ 24 апреля 2019

Вы устанавливаете graphData1 = graphData2, чтобы они были одним и тем же массивом. Затем вы помещаете все свои точки данных в один массив, который показан на обеих диаграммах.

Заменить 

var graphData1, graphData2, graphData3 = [];

// and

function deleteGraph() {
    graphData1 = graphData2 = graphData3 = [];

с 

var graphData1 = [], graphData2 = [], graphData3 = [];

// and

function deleteGraph() {
    graphData1 = [];
    graphData2 = [];
    graphData3 = [];
...