echarts Hello world 入門
阿新 • • 發佈:2018-01-18
官網下載 init pla splay opened wid val log div
<!DOCTYPE html> <html> <head> <title></title> <script type="text/javascript" src="echarts.js"></script> </head> <body> <div id="main" style="width: 600px;height:400px;"></div> <script type="text/javascript">View Code// 基於準備好的dom,初始化echarts實例 var myChart = echarts.init(document.getElementById(‘main‘)); // 指定圖表的配置項和數據 option = { xAxis: { type: ‘category‘, data: [‘Mon‘, ‘Tue‘, ‘Wed‘, ‘Thu‘, ‘Fri‘, ‘Sat‘, ‘Sun‘] }, yAxis: { type: ‘value‘ }, series: [{ data: [820, 932, 901, 934, 1290, 1330, 1320], type: ‘line‘ }] }; // 使用剛指定的配置項和數據顯示圖表。 myChart.setOption(option); </script> </body> </html>
可以通過官網下載 echarts ,然後引入相關的echarts.js.
設置存放圖像的容器
設置echarts 參數,這個可以設置多種多樣的形式,參照官網
然後 ,最後綁定options
結果
echarts Hello world 入門