各位小伙伴在繪制原型的時(shí)候

總是需要用到各種各樣的圖表

繪圖不僅不美觀還特別麻煩

這時(shí)EChart的圖表基本能滿足各位

可是

怎么將頁面的圖表

生成可以嵌入的html文件呢

其實(shí)嵌入的步驟

和嵌入地圖的步驟都是一樣的

所以

接下來要演示的是

怎么將ECharts的圖表生成html文件

首先打開ECharts官方網(wǎng)站

地址:https://echarts.baidu.com/

然后打開頂部的官方示例

選擇你想要用到的圖表

選擇主題顏色然后下載

然后就HTML文件就下載好了

...

...

...

...

...

...

...

...

你以為結(jié)束了?

干貨可能這么少的嗎?

當(dāng)然不是

其實(shí)EChart官方的案例很少

又很局限

所以想找合適的ECharts圖表

要去看其他用戶上傳的圖表

點(diǎn)擊頂部導(dǎo)航的社區(qū)下的畫廊

打開后,笑容逐漸滑稽

然而

這些案例都無法下載

.......

那要怎么樣才能下載呢?

首先

將左邊的代碼全選復(fù)制

替換掉官方案例左邊的代碼

然后點(diǎn)擊運(yùn)行

這個(gè)千萬不要更換主題

點(diǎn)擊更換主題則會(huì)變回官方示例

最后再點(diǎn)擊下面的下載即可

如果有運(yùn)行不了的可能是該文件引用了jquery

只有在代碼的最上面加入jquery的引入即可

代碼如下:

<script? src="https://code.jquery.com/jquery-3.3.1.js"??integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="??crossorigin="anonymous"></script>

最后下載下來的文件

就可以直接引入內(nèi)聯(lián)框架使用

對(duì)該使用不熟的小伙伴可以參考公眾號(hào)中

"如何在Axure中嵌入百度地圖"

這一篇文章中嵌入的演示

該案例結(jié)束

skr~

如果對(duì)原型交互感興趣的小伙伴可以關(guān)注我的個(gè)人訂閱號(hào)

小白在線等