2016-04-27 21 views
0

我想爲可變數量的可跟蹤對象創建可變數量跟蹤器的flot圖表。我的代碼似乎工作到目前爲止,但我注意到2個異常。如何動態創建Flot JS的數據集?

如果以下值超過1: 「var trackerList = [」a「,」b「,」c「,」d「,」e「];」 它只顯示數組中的最後一個值。

如果超過1的值爲: var registeredTrackableObjects = [「a」,「b」,「c」,「d」]; 它什麼也沒有顯示。

我見過幾個例子,所以我想我的代碼應該工作,我錯過了什麼? 雖然我在上面,但是最好的方法是每秒更新一次圖表,最好的方法是什麼?我想用我的java代碼中的實際數據交換測試值的東西。

謝謝。

<script type="text/javascript"> 
 
$(document).ready(function() 
 
{ \t 
 
\t //Test values 
 
\t var intensity = 5; 
 
\t var trackerList = ["a", "b", "c", "d", "e"]; 
 
\t var registeredTrackableObjects = ["a", "b", "c", "d"]; 
 
\t 
 
\t 
 
\t var xDistance = 1.05;//Distance between bars 
 
\t var yMin = 0; 
 
\t var yMax = 20; 
 
\t var xMin = 0; 
 
\t var xMax = 10; 
 
\t var data = [];//Flot JS format, which contains pairs of {label, array} 
 
\t var customBarArray = []; 
 
\t var customBar = []; 
 

 
\t //Create a data set for every TO 
 
\t for(i = 0; i<registeredTrackableObjects.length; i++) 
 
\t { 
 
\t \t //Create 1 bar for every tracker 
 
\t \t customBar = []; 
 
\t \t 
 
\t \t for(j = 0; j<trackerList.length; j++) 
 
\t \t { 
 
\t \t \t customBar[j] = j; 
 
\t \t \t customBar.push([xDistance * j, intensity]); 
 
\t \t } 
 
\t \t 
 
\t \t customBarArray.push(customBar); 
 
\t \t var name = "Beacon: " + i; 
 
\t \t data.push({label: name, data: customBarArray[i]}); 
 
\t \t xDistance += 1.05; 
 
\t } 
 

 
    
 
    $.plot($("#placeholder"), data, 
 
    { 
 
     series: { 
 
      bars: { 
 
       show: true, 
 
       barWidth: 0.1, 
 
       lineWidth: 0, 
 
       order: 1, 
 
       fillColor: { 
 
        colors: [{ 
 
         opacity: 1 
 
        }, { 
 
         opacity: 0.7 
 
        }] 
 
       } 
 
      } 
 
     }, 
 
     xaxis: { 
 
      mode: "time", 
 
      min: xMin, 
 
      max: xMax, 
 
      tickLength: 0, 
 
      tickSize: [1, "month"], 
 
      axisLabel: 'Month', 
 
      axisLabelUseCanvas: true, 
 
      axisLabelFontSizePixels: 10, 
 
      axisLabelFontFamily: 'Verdana, Arial, Helvetica, Tahoma, sans-serif', 
 
      axisLabelPadding: 1 
 
     }, 
 
     yaxis: { 
 
      min: yMin, 
 
      max: yMax, 
 
      axisLabel: 'Value', 
 
      axisLabelUseCanvas: true, 
 
      axisLabelFontSizePixels: 10, 
 
      axisLabelFontFamily: 'Verdana, Arial, Helvetica, Tahoma, sans-serif', 
 
      axisLabelPadding: 5 
 
     }, 
 
     legend: { 
 
      backgroundColor: "#EEE", 
 
      labelBoxBorderColor: "none" 
 
     }, 
 
     colors: ["#AA4643", "#89A54E", "#4572A7"] 
 
    }); 
 
}); 
 
</script>

回答

0

我現在固定它自己。只要刪除customBar[j] = j;,它會工作。