2018年5月15日
var walk = 'image://../images/health_walk.png';
var dom = document.getElementById("recoveryChart");
var myChart = echarts.init(dom);
var app = {};
option = null;
option = {
tooltip: {
trigger: 'axis',
formatter: '{b}<br />{a1}:{c1}'
},
legend: {
show: true,
data: ['改善目标'],
textStyle: {
color: '#000'
},
left: 38
},
grid: {
top: 60,
left: 8,
containLabel: true,
},
color: ['#0f0', '#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae', '#749f83', '#ca8622', '#bda29a', '#6e7074', '#546570', '#c4ccd3'],
xAxis: {
type: 'category',
boundaryGap: false,
interval: 1,
data: [0, '第2周', '第4周', '第6周', '第8周', '第10周', '第12周'],
splitLine: {
show: false,
lineStyle: {
type: 'solid',
color: '#000',
},
interval: 0
},
axisTick: {
show: false
},
axisLine: {
lineStyle: {
color: '#000'
},
},
},
yAxis: {
name: '公斤',
type: 'value',
nameGap: 6,
splitLine: {
show: false,
lineStyle: {
color: '#000'
}
},
axisLine: { //坐标轴线设置
lineStyle: {
color: '#000'
}
},
axisTick: { //坐标轴刻度设置
show: false
},
nameTextStyle: {
color: '#000'
},
axisLabel: { //坐标轴刻度标签设置
color: '#000'
},
splitArea: { //分隔区域样式设置
show: false,
areaStyle: {
color: ['rgba(250,250,250,0.3)', 'rgba(200,200,200,0.3)'],
},
},
},
series: [{
type: 'pictorialBar',
symbol: walk,
symbolSize: [15, 23],
z: 10,
data: [{
value: 88,
symbolPosition: 'end',
symbolOffset: [15,-23]
},{
},{
},{
},{
},{
},{
value: 71,
symbolPosition: 'end',
symbolOffset: [-15, -23]
}]
},{
name: '改善目标',
type: 'line',
step: 'middle',
lineStyle: {
normal: {
color: '#ff9743',
},
},
itemStyle: {
normal: {
color: '#ff9743'
}
},
data: [88, 86, 83.5, 81, 76.9, 73, 71]
}]
};
if(option && typeof option === "object") {
myChart.setOption(option, true);
}