在HTML表格中選擇行來更新圖表選擇？

如何使用與圖表（Flotr或D3）相關的數據設置HTML + JS表格;我可以在哪裏多選行，並且會更新圖表中顯示的內容？ - 我很可能會使用AngularJS，所以他們的雙向數據綁定可能是幫助...在HTML表格中選擇行來更新圖表選擇？

如：

<table> 
    <thead> 
     <tr><th>Vowel</th> <th>Amount</th></tr> 
    <thead> 
    <tbody> 
     <tr> <td>A</td> <td>3</td> </tr> 
     <tr> <td>E</td> <td>6</td> </tr> 
     <tr> <td>I</td> <td>7</td> </tr> 
     <tr> <td>O</td> <td>8</td> </tr> 
     <tr> <td>U</td> <td>9</td> </tr> 
    </tbody> 
</table>

pie graph

也將是巨大的能例如：在餅圖上按E和A將刷新餅圖+表格。

來源

2013-05-15 Foo Stack

當表單被點擊時，你想在圖上做什麼樣的更新？ – conca

這是一個相當廣泛的問題。你試過了什麼，它不工作的地方？表格行上的鼠標向下和鼠標移動事件應該足夠了。 – minikomi

conca：圖表應該顯示關於我在表格中選擇的數據的聚合信息;反之亦然。 –

http://plnkr.co/edit/x1jGW0lqKyzV7EKsVAbJ?p=preview

這裏是你如何能做到這一點的例子。

一旦你創建了一個指令來連接你的數據和DOM，然後通過模板來處理數據模型很簡單。

我重用了我用於其他項目的flot集成指令。（這個'可重用性'是我喜愛的AngularJs。）

來源

2013-05-15 22:48:33 Tosh

在HTML表格中選擇行來更新圖表選擇？

回答

相關問題