今天小編為大家推薦一個(gè)神奇的酷站。ECharts，一個(gè)純 Javascript 的圖表庫(kù)。

?

以下是各個(gè)幾個(gè)不錯(cuò)的界面的介紹：

首頁(yè)：?http://echarts.baidu.com/

在首頁(yè)有完整的說(shuō)明，也專門(mén)的例子進(jìn)行講解，如果有一定前端基礎(chǔ)，可以很快上手。而沒(méi)有經(jīng)驗(yàn)的，照模畫(huà)樣也可以弄出來(lái)。

?

一般例子：?http://echarts.baidu.com/echarts2/doc/example.html

一般性的例子里面包含了常用的一般性表格，點(diǎn)擊進(jìn)去就可以看到代碼。修改后點(diǎn)擊刷新就能得到修改后的樣子

?

特別例子：?http://echarts.baidu.com/examples.html#chart-type-graph
畫(huà)廊：?http://gallery.echartsjs.com/explore.html#sort=rank~timeframe=all~author=all

在特別例子和畫(huà)廊里，有官方的精美例子，而Gallery里面則是用戶自己制作的一些精美圖形來(lái)進(jìn)行分享。你所需要做的，就是過(guò)去拷貝代碼拿來(lái)用。

?

---

?

大家可以欣賞欣賞特效案例：

?

?

?

?

?

---

還可以進(jìn)行立體像素風(fēng)案例制作：

選一張色彩豐富的顏料圖作為原始素材

接下來(lái)就是見(jiàn)證奇跡的時(shí)刻～

?

?

可以通過(guò)鼠標(biāo)拖動(dòng)來(lái)改變視角，通過(guò)滾輪來(lái)放大縮小圖像～～

是不是超酷呢？再調(diào)整一下參數(shù)試試～～

?

簡(jiǎn)直整容術(shù)～～再稍微調(diào)整一下，然后只需要在畫(huà)面中心右鍵，圖片另存為，大功告成～～

?

?

---

?

ECharts 好處：

1、開(kāi)源軟件，并且我們提供了非常炫酷的圖形界面，特色是地圖，另外還提供了柱狀圖、折線圖、餅圖、氣泡圖及四象限圖等；

2，使用簡(jiǎn)單，在官網(wǎng)中為我們封裝了js，只要會(huì)引用就會(huì)得到完美的展示效果；

3，種類多，echarts實(shí)現(xiàn)簡(jiǎn)單，各類圖形都有；相應(yīng)的模板，還有豐富的API及文檔說(shuō)明，非常詳細(xì)；

4，兼容性好，基于html5，有著良好的動(dòng)畫(huà)渲染效果。

?

怎么樣 是不是非常有用啊~~？小編雖然對(duì)前端的代碼不是特別懂，但看到Echarts提供的豐富的圖表類型后瞬間樂(lè)開(kāi)花哈哈，強(qiáng)大的數(shù)據(jù)可視化功能，對(duì)學(xué)數(shù)學(xué)的我非常有幫助吶啦啦啦～～～這個(gè)站是不是對(duì)你也很有幫助哇，哈哈歡迎給我留言一起討論呦～～～

?

轉(zhuǎn)載于:https://www.cnblogs.com/gbin1/p/7735079.html

總結(jié)

以上是生活随笔為你收集整理的【前端酷站】分享一个纯 Javascript 的图表库与立体像素风制作～的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。