flot.js - 點與x軸，空數據集，圖例重疊不匹配

剛開始時第一次使用flot.js並且有一些問題/問題。圖表顯示罰款減去一些困擾我的事情。flot.js - 點與x軸，空數據集，圖例重疊不匹配

1 - 蜱和日期似乎沒有正確排列。例如，在目前的圖表中，我正在研究兩天內只有兩個條目。由於某種原因，實際數據值（點）不會超過其對應的日期。在這裏看到圖像 example chart

2 - 是否有任何方法使y軸大於數據集以防止線條與圖例重疊？在這個例子中，它很好，但我看到其他數據與圖例重疊的地方。

3 - 如何處理沒有數據？我打算在此擴展以允許用戶選擇開始/結束日期...因此，如果沒有結果，是否有一個很好的方式來返回此信息和/或可能在圖表中顯示一條消息？這裏最主要的是當沒有數據時腳本不會中斷。

JS：

//get the data 
$.ajax({ 
    url: "/process/chart_main.php", 
    type: "POST", 
    dataType: "json", 
    success: onDataReceived 
}); 

function onDataReceived(series) { 

    console.log(series); 
    // Load all the data in one pass; if we only got partial 
    // data we could merge it with what we already have. 
    data = series; 

    var options = { 
     series: { 
      lines: { 
       show: true, 
       lineWidth: 2, 
       fill: true, 
       fillColor: { 
        colors: [{ 
          opacity: 0.05 
         }, { 
          opacity: 0.01 
         } 
        ] 
       } 
      }, 
      points: { 
       show: true 
      }, 
      shadowSize: 2 
     }, 
     grid: { 
      hoverable: true, 
      clickable: true, 
      tickColor: "#eee", 
      borderWidth: 0 
     }, 
     //colors: ["#d12610", "#37b7f3", "#52e136"], 
     xaxis: { 
      tickSize: [1, "day"], 
      mode: "time", 
      timeformat: "%m-%d-%Y" 
     }, 
     yaxes: [{ 
      position: "left" 
     }], 
     legend: { 
      position: "ne" 
     } 
    }; 

    $.plot("#flot_chart", data, options); 
}

PHP：

//actual select removed for this display 
$results = $stmt->fetchAll(PDO::FETCH_ASSOC); 

if($results) 
{ 
    foreach($results as $row) 
    { 
     $data1[] = array(strtotime($row['date']) * 1000, $row['day_count']); 
    } 

    //send our data values to $mergedData, add in your custom label and color 
    $mergedData[] = array('label' => "Events" , 'data' => $data1, 'color' => '#37b7f3'); 
} 

// return result array to ajax 
echo json_encode($mergedData);

來源

2014-07-13 user756659

大概蜱日午夜（2014年7月9日00:00:00），而數據點不是。如果你想將它們排成一行，從數據點中刪除時間，或者給出與數組相同的時間作爲數組而不是tickSize選項（see here，必須給出時間戳記，就像數據點中一樣）：
```
xaxis: { 
    ticks: [1405942268798, 1405942368798, ...] 
} 
```

使用的軸選項min和max性質（見同上鏈接）：

xaxis: { 
    min: 1405942268798, 
    max: 1405942368798 
}

海軍報不「破發」時，有沒有數據，它只是顯示一張空的圖表。如果你想顯示的附加信息，您可以在調用$.plot()之前檢查自己：
```
if (data.length == 0) { 
    alert('No data'); 
} 
```

來源

2014-07-21 11:40:54 Raidri

flot.js - 點與x軸，空數據集，圖例重疊不匹配

回答

相關問題