關於使用echarts心得,及其注意事項
阿新 • • 發佈:2018-11-27
- 第一步匯入jquery、echarts的包
- 程式碼如下:
<script src="static/scripts/jquery/echarts.js"></script>
<script src="static/scripts/jquery/jquery-1.4.4.min.js"></script>
- 第二部建立div盒子:
- 程式碼如下:
//注意事項: 1、一定要給定寬高,其他css樣式是我後期加上去的。 2、id='main'是後期dom物件需要的 <div id="main" style="width: 800px;height: 400px;padding-top: 100px;padding-bottom: 100px;padding-left: 300px"></div>
- 第三部建立一個初始化模組,放置官網程式碼:
- 程式碼如下:
<script type="text/javascript"> //初始化echarts例項,dom使用id=‘main’進行初始化 var myChart = echarts.init(document.getElementById('main')); var option={ 注意事項: 1、這裡面放入從官網複製過來的程式碼,只要複製option{裡面程式碼} 2、把script標籤放在div後面(共同讓入body中),我在放入head標籤內時無顯示圖片,放在body最下面也沒反應,這點可以借鑑下 3、基本上所有的echarts程式碼往這裡面套就行了 } //使用制定的配置項和資料顯示圖表 myChart.setOption(option); </script>
轉載請攜帶連線謝謝,希望能幫到大家,我也搞了一晚上才總結出來,希望小夥伴一定遇事要冷靜哦!