[英]Flot Chart from Data Table
我想從表中構建浮動圖表。 該表是使用jquery datatables插件構建的。 該表可以內聯編輯。
我想知道是否有人提示在flt中顯示數據。 您要從json提取數據還是直接從圖表中提取數據以構建浮動圖表?
使用datatables jquery插件動態填充數據。
桌子看起來像這樣。
<div id="plotarea">
<table>
<caption>GDP, based on exchange rates, over time. Values in billion USDs.</caption>
<tr>
<td></td>
<th scope="col">2003</th>
<th scope="col">2002</th>
<th scope="col">2001</th>
<th scope="col">2000</th>
<th scope="col">1999</th>
<th scope="col">1998</th>
</tr>
<tr>
<th scope="row">USA</th>
<td>10,882</td>
<td>10,383</td>
<td>10,020</td>
<td>9,762</td>
<td>9,213</td>
<td>8,720</td>
</tr>
<tr>
<th scope="row">EU</th>
<td>10,970</td>
<td>9,040</td>
<td>8,303</td>
<td>8,234</td>
<td>8,901</td>
<td>8,889</td>
</tr>
</table>
</div>
謝謝!
您可以使用循環遍歷表並為flot構建數據數組。 像這樣:
var headerTr = $('table tr:first()');
var rowCount = $('table tr').length - 1;
var data = [];
for (var row = 0; row < rowCount; row++) {
var tr = $('table tr').eq(row + 1);
var dataseries = {
label: tr.find('th').text(),
data: []
};
for (var col = 0; col < tr.find('td').length; col++) {
var xval = headerTr.find('th').eq(col).text();
var yval = tr.find('td').eq(col).text().replace(',', '');
dataseries.data.push([xval, yval]);
}
data.push(dataseries);
};
這是一個有用的例子。 單擊按鈕即可開始繪圖。 對於數據表,您可以將其更改為onchange
事件或類似事件。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.