300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 常用echart图表(柱状图 折线图 饼图 环形进度条 雷达图等等)基础配置和用法 resi

常用echart图表(柱状图 折线图 饼图 环形进度条 雷达图等等)基础配置和用法 resi

时间:2023-09-23 08:56:38

相关推荐

常用echart图表(柱状图 折线图 饼图 环形进度条 雷达图等等)基础配置和用法 resi

一、最简单的使用方式引入官方echart.js即可

<script src="js/echarts.js"></script>

二、页面准备一个DOM容器

<div id=“main”></div>

三、基础用法三步骤

//1、 基于准备好的dom,初始化echarts实例var myChart = echarts.init(document.getElementById(main));//2、 指定图表的配置项和数据var option = {...}//这里先省略,下面一一介绍不同图表的相关配置//3、使用刚指定的配置项和数据显示图表。myChart.setOption(option);

四、不同图表的相关option数据配置

(1)折线图的option配置如下

option:{xAxis: {type: category,boundaryGap: false,data: [9-15,9-17,9-21,9-23,9-25,9-27,9-29],axisLabel: {show: true,textStyle: {

常用echart图表(柱状图 折线图 饼图 环形进度条 雷达图等等)基础配置和用法 resize()响应 轮播tooltip

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。