NPM install ECharts

npm install echarts --save
Copy the code

The introduction of ECharts

import * as echarts from 'echarts'; Var myChart = echarts.init(document.getelementById ('main')); Mychart.setoption ({title: {text: 'ECharts starting example '}, Tooltip: {}, xAxis: {data: [' shirts' and 'sweater', 'snow spins unlined upper garment,' pants', 'high heels',' socks']}, yAxis: {}, series: [{name: 'sales' type:' bar 'data: [5, 20, 36, 10, 10, 20]}]})Copy the code

Import ECharts diagrams and components as needed

/ Introduces the Echarts core module, which provides the interface required for echarts use. import * as echarts from 'echarts/core'; Chart import {BarChart} from 'echarts/charts'; // Introduce prompt box, title, cartesian coordinate component, Component import {TitleComponent, TooltipComponent, GridComponent} from 'echarts/ Components '; Import {CanvasRenderer} from 'echarts/renderers'; Echarts.use ([TitleComponent, TooltipComponent, GridComponent, BarChart, CanvasRenderer]); Var myChart = echarts.init(document.getelementById ('main')); var myChart = echarts.init(document.getelementById ('main')) myChart.setOption({ ... });Copy the code

The Settings in option

var option = {
    grid: {
        left: 30,
        right:'10%',
        height: '50%',
        bottom: 110
    }
}
Copy the code

Dark background and light label

setOption({
    backgroundColor: '#2c343c'
})
Copy the code
SetOption ({textStyle: {color: 'rgba(255, 255, 255, 0.3)'}})Copy the code