百度echarts图表配置语法介绍

做一个百度eCharts需要哪些函数，下面web建站小编给大家介绍一下百度eCharts图表的配置语法。

一、创建一个html页面

//引入echarts
<script src="echarts.min.js"></script>
//新建一个div
<div id="main" style="width: 600px; height:400px;"></div>

二、echarts配置语法介绍

// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));

标题

title: {
  text: '名称'
}

提示信息

tooltip: {}

图例组件

legend: {
  data: [{
    name: '系列1',
    // 强制设置图形为圆。
    icon: 'circle',
    // 设置文本为红色
    textStyle: {
      color: 'red'
    }
  }]
}

X 轴

xAxis: {
  data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
}

Y 轴

yAxis: {}

系列列表

series: [{
  name: '销量',  // 系列名称
  type: 'bar',  // 系列图表类型
  data: [5, 20, 36, 10, 10, 20]  // 系列中的数据内容
}]

图表类型介绍：

type: 'bar'：柱状/条形图
type: 'line'：折线/面积图
type: 'pie'：饼图
type: 'scatter'：散点（气泡）图
type: 'effectScatter'：带有涟漪特效动画的散点（气泡）
type: 'radar'：雷达图
type: 'tree'：树型图
type: 'treemap'：树型图
type: 'sunburst'：旭日图
type: 'boxplot'：箱形图
type: 'candlestick'：K线图
type: 'heatmap'：热力图
type: 'map'：地图
type: 'parallel'：平行坐标系的系列
type: 'lines'：线图
type: 'graph'：关系图
type: 'sankey'：桑基图
type: 'funnel'：漏斗图
type: 'gauge'：仪表盘
type: 'pictorialBar'：象形柱图
type: 'themeRiver'：主题河流
type: 'custom'：自定义系列