1、在标准中添加字段
注：（@后面跟的数字，是标准中列的第几个，跟结果中的列的顺序没有任何关系，初学者不要弄混了）
2、然后在结果中添加叙述
3、然后在叙述中添加代码
注意：要勾上“包含HTML标记”前面的选项,嵌入代码，就可以使用了。需要引用标准中数据，直接使用@就可以了。
要显示的行，定义为1，好奇的可以看看不定义为1是什么情况。
前缀代码引入echart2.0官网的js
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>JSP Page</title>
</head>
<body>
<div id="mainA" style="height:400px ;1300px" ></div>
<script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
<script type="text/javascript">
require.config({
paths: {
echarts: 'http://echarts.baidu.com/build/dist'
}
});
// 定义需要的数据
A1=[ ];
A2=[ ];
A3=[ ];
A4=[ ];
前缀代码引入echart3.0官网的js
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>JSP Page</title>
</head>
<body>
<div id="mainA" style="height:400px ;1300px" ></div>
<script src="http://echarts.baidu.com/dist/echarts.js"></script>
<script type="text/javascript">
// 定义需要的数据
A1=[ ];
A2=[ ];
A3=[ ];
A4=[ ];
叙述部分接收模型数据
A1.push('@1');//字符串类型
A2.push(@2);//数字类型
A3.push(@3);
A4.push(@4);
后缀部分
/*******************************************************************/第一部分为请求的模块类型及初始化 ID同一个分析不要重，与前缀的一致
require ( [ 'echarts', 'echarts/chart/bar' // 使用柱状图就加载bar模块，按需加载 ], function (ec) { // 基于准备好的dom，初始化echarts图表
var myChart= ec.init(document.getElementById('main1'));//修改主题样式var myChart = ec.init(document.getElementById('main1'),'macarons');
/**************************************************************************/第二部分 echart提供的实例代码，引入模型数据A1、A2、A3、A4
option = {
title : {
text: '订单结算量和收入',
subtext: '纯属虚构'
},
tooltip : {
trigger: 'axis'
},
legend: {
data:['收入','结算量']
},
toolbox: {
show : true,
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
magicType : {show: true, type: ['line', 'bar']},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
xAxis : [
{
type : 'category',
data : A1 //引入数据的数据
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
name:'收入',
type:'bar',
data:A2,
markPoint : {
data : [
{type : 'max', name: '最大值'},
{type : 'min', name: '最小值'}
]
},
markLine : {
data : [
{type : 'average', name: '平均值'}
]
}
},
{
name:'结算量',
type:'bar',
data:A3,
markPoint : {
data : [
{type : 'max', name: '最大值'},
{type : 'min', name: '最小值'}
]
},
markLine : {
data : [
{type : 'average', name : '平均值'}
]
}
}
]
};
/********************************************************/
myChart.setOption(option);
}
);
</script>
</body>
</html>
echart2.0和3.0的配置有一些不同需要根据自己的实例选择