前端学习（二）Echarts入门——html实现简单echarts图例
生活随笔
收集整理的這篇文章主要介紹了
前端学习（二）Echarts入门——html实现简单echarts图例
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
前一篇文章，我們已經將echarts的js文件導入到我們的項目中。現在，我們就開始來具體實現一下如何在html中插入我們的ecahrts圖。
首先，我們可以去ecahrts官網找幾個例圖。
官網地址：https://echarts.baidu.com/
選擇實例——官方實例
在官方實例中我們選取一個折線圖來繪制。
我們找到代碼，直接復制到我們的html中是不可以的。
我們還需要進行下面的幾個步驟。
1.我們的ecahrts圖是寫在script標簽中的。所以，在body標簽外面寫一個script標簽來容納我們的echarts。
2.我們需要對我們的echarts進行聲明變量，通過下面這條語句
var myChart = echarts.init(document.getElementById('chart'));```3.我們需要聲明實例對象
var options = {..........}4.最后一條最重要的是不要忘了，最后寫一句
myChart.setOption(options);這條語句是讓我們的ecahrts圖顯示出來。
ok了，下面我們來看一下效果以及完整代碼。
完整代碼（echarts圖中有很多參數是可以按照個人愛好以及圖的要求來修改的，更多內容后續會不定時更新！感謝大家支持！）：
總結
以上是生活随笔為你收集整理的前端学习（二）Echarts入门——html实现简单echarts图例的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 收银软件哪家强？2023年收银软件排行榜
- 下一篇： Windows7 64位系统PL2303