|
|
完成后，做個(gè)筆記，大家分享一下，互相學(xué)習(xí)。其中還有點(diǎn)問(wèn)題，還不是很完善。
其中參考了百度空間，中管理中心，訪問(wèn)統(tǒng)計(jì)，的js統(tǒng)計(jì)圖表。但是應(yīng)用上還是有差別，因?yàn)槲易龅倪@個(gè)項(xiàng)目中，需要時(shí)實(shí)的繪制新的統(tǒng)計(jì)表格，當(dāng)有數(shù)據(jù)變化的時(shí)候，就會(huì)調(diào)用繪制表格的方法。所以要考慮頁(yè)面性能的問(wèn)題。
下面是完成后的預(yù)覽圖，可以看到，繪制一個(gè)表格，耗時(shí)0.005毫秒，也就是200分之一秒。效率我還是比較滿意的！
目前在firefox，chrome，IE8，正常沒(méi)問(wèn)題，IE6下有問(wèn)題，我現(xiàn)在已經(jīng)不管IE6了，做前端的兄弟們要盡量引導(dǎo)用戶放棄IE6啦。
全部代碼如下：可復(fù)制直接運(yùn)行。
現(xiàn)在有一個(gè)問(wèn)題，求解，就是在firebug調(diào)試狀態(tài)下，鼠標(biāo)一旦移動(dòng)到水平標(biāo)尺線上，則報(bào)錯(cuò)！
哪位知道如何解決這個(gè)問(wèn)題，請(qǐng)不吝賜教！謝謝！
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
這個(gè)圖表做完了，還有點(diǎn)小小的遺憾，就是那個(gè)困擾我的，firebug調(diào)試狀態(tài)，鼠標(biāo)移動(dòng)到水平標(biāo)尺線上，報(bào)錯(cuò)！！
總結(jié)一下：Javascript操作dom元素的基本功。繪制圖表之前要有一個(gè)草稿，對(duì)于復(fù)雜的圖表，必須在紙上畫(huà)出來(lái)，才能有一個(gè)清晰的思維，開(kāi)始進(jìn)行編碼。
代碼打包下載
JavaScript技術(shù)：javascript實(shí)現(xiàn)的柱狀統(tǒng)計(jì)圖表，轉(zhuǎn)載需保留來(lái)源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
