color: ['#3398DB'],
//默认的提示框及提示文字
/*tooltip : {
trigger: 'axis',
axisPointer : { // 坐标轴指示器，坐标轴触发有效
type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
}
},*/
//自定义提示框的提示格式和文字
tooltip: { //工具提示 提示框
trigger: 'item',
formatter: function (params) {
return params.name + ' <br/>直接访问： ' + params.data + '个';
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis : [
{
type : 'category',
data : ['Mon', 'Tue', '
option = { color: ['#3398DB'],//默认的提示框及提示文字 /*tooltip : { trigger: 'axis', axisPointer : { // 坐标轴指示器，坐标轴触发有效 type : 'shadow' // 默认为直线，可选为：'l...
一、
echarts
折线图(折线统计图)
折线图在我们也是我们的数据可视化图表中最常用的一种图表之一，是用折线将各个数据
点
标志连接起来的图表，不仅可以表示数量的多少，而且可以反映同一事物在不同时间里的发展变化的情况以及变化趋势。
看着官网示例的这些花花绿绿的折线图，相信在日常的开发中，只要稍加配置调一下，已经可以满足9成的需求了。
二、
echarts
的下载、安装与使用
在上一篇的文章里，我们主要是学习如何快速上手
Echarts
的一些属性设置，我们演示的时候用的引入方式是一次性引入所有的资源。
维度0 维度1 维度2 维度3
[ 12, 44, 55, 60 ], 这是第一个 dataItem
[ 53, 31, 21, 56 ], 这是第二个 dataItem
[ 71, 33, 10, 20 ], 这是第三个 dataItem
series:[{
type:'cus
关于
Echarts
的配置项，再好的总结也不如官方文档详细，明了，而且可以直接在线设置看效果，简直不要太赞。那么我只是知识的搬运工，将自己的一些使用和尝试记录下来。
一个重要的属性 show
在整个
echarts
图标中，如果有些图例 你想控制显示与否那么就设置show 属性值，大部分有这个属性默认show : true,自己需要做调整不显示时可设置为false，title 标题组件，legend 图例组件 ，grid 是否显示，xAxis yAxis,toolbo...
trigger: 'axis', // 触发类型
axisPointer: { // 坐标轴指示器配置项。
type: 'shadow', // 'line' 直线指示器 'shadow' 阴影指示器 'none' 无指示器
// backgroundColor: ‘rgba(0,0,0,0)’,
// 默认色板
color: ['#ff7f50','#87cefa','#da70d6','#32cd32','#6495ed',
'#ff69b4','#ba55d3','#cd5c5c','#ffa500','#40e0d0',
'#1e90ff','#ff63...
formatter: function(params) {
var res = params[0].name;
res += '<br/>' + params[0].seriesName + ': ' + params[0].value;
res += '<br/>
自定义
文字
：这里是
提示框
的
自定义
文字
';
return res;
// 其他配置项
series: [
name: '数据',
type: 'line',
data: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100],
// 其他配置项
在上面的代码中，`tooltip` 是
Echarts
中的
提示框
配置项，`formatter` 属性用于设置
提示框
内容的格式化函数。在 `formatter` 函数中，可以通过 `params` 参数获取到当前数据的信息，然后将需要的信息组合成一个字符串返回即可。在上面的示例中，除了显示当前数据的名称和数值之外，还添加了一行
自定义
文字
作为
提示框
的内容。
