1234567891011121314151617181920212223242526272829303132333435363738394041424344454647 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <title>01.饼图</title>
- <script src="lib/echarts.min.js"></script>
- </head>
- <body>
- <div style="width: 600px;height:400px"></div>
- <script>
- //1.是ECharts最基本的代码结构
- //2、准备数据[{name:???,value:???},{}]
- //3、将type的值设置为pie
- var mCharts = echarts.init(document.querySelector("div"))
- //pieData就是需要设置给饼图的数据,数组,数组中包含一个有一个的对象,每一个对象中,需要有name和value
- var pieData = [
- {
- name:'淘宝',
- value:1121
- },
- {
- name:'京东',
- value:2103
- },
- {
- name:'唯品会',
- value:120
- },
- {
- name:'苏宁易购',
- value:522
- }
- ]
- var option = {
- series:[
- {
- type:'pie',
- data:pieData
- }
- ]
- }
- mCharts.setOption(option)
- </script>
- </body>
- </html>
|