2017-10-02 10 views
0

L'exemple ci-dessous fonctionne pour exécuter Epoch en temps réel, cependant, ce que je suis en train de faire est en cours d'exécution en ligne de plusieurs couches au lieuEpoch graphiques en temps réel - multicouches - Javascript

var barChartData = [{ 
    label: "Series 1", 
    values: [{ 
    time: getTimeValue(), 
    y: getRandomValue() 
    }, 
{ 
     label: "Series 2", 
     values: [{ 
     time: getTimeValue(), 
     y: getRandomValue() 
     } 

]}, ]; 

d'un comme ci-dessous, mais je ne suis pas sûr de savoir comment pousser les données pour différentes couches? de l'aide? J'ai essayé de pousser les données avec le multicouche, mais j'ai reçu une erreur, et je n'ai trouvé aucune indication dans la documentation d'Epoch API? toute aide serait très apprécié

///////////////this function generates the date and time in milliseconds////////// 

function getTimeValue() { 
    var dateBuffer = new Date(); 
    var Time = dateBuffer.getTime(); 
    return Time; 
} 

////////////// this function generates a random value //////////////////////////// 
function getRandomValue() { 
    var randomValue = Math.random() * 100; 
    return randomValue; 
} 

////////////// this function is used to update the chart values /////////////// 
function updateGraph() { 
    var newBarChartData = [{time: getTimeValue(), y:getRandomValue()}]; 

    barChartInstance.push(newBarChartData); 
} 

////////////// real time graph generation////////////////////////////////////////  
var barChartData = [{ 
    label: "Series 1", 
    values: [{ 
    time: getTimeValue(), 
    y: getRandomValue() 
    }] 
}, ]; 

var barChartInstance = $('#barChart').epoch({ 
    type: 'time.bar', 
    axes: ['right', 'bottom', 'left'], 
    data: barChartData 
}); 

code Html ci-dessous pour exécuter le code,

<head> 
    <script src="https://code.jquery.com/jquery-1.11.3.js"> 
    </script> 
    <script src="http://www.goldhillcoldtouch.co.uk/wp-content/uploads/d3.min.js"> 
    </script> 
    <script src="http://www.goldhillcoldtouch.co.uk/wp-content/uploads/epoch.min.js"></script> 
    <link rel="stylesheet" type="text/css" href="http://www.goldhillcoldtouch.co.uk/wp-content/uploads/epoch.min.css"> 
</head> 

<div id="barChart" class="epoch category10" style="width:320px; height: 240px;"></div> 
<p id="updateMessage" onclick="updateGraph()">click me to update chart</p> 

Répondre

0

Je trouve la réponse, au fond, vous pouvez pousser un objet des données avec tableau de valeurs comme ci-dessous ...

chart.push([ 
    { time: time, y: x}, 
    { time: time, y: x * Math.log(x)}, 
    { time: time, y: x * Math.pow(Math.log(x), 2)} 
]);