<script>
var myChart = echarts.init(document.getElementById('main'));
myChart.setOption({
tooltip : {
trigger: 'item',
axisPointer : { // 坐标轴指示器,坐标轴触发有效
type : 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
legend: {
data: ['播种期', '出苗期','移栽期','返青期','抽穗期','成熟期'],
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true,
default: '1',
height:100,
},
yAxis : [
{
type : 'category',
position: 'bottom',
boundaryGap: true,
axisLine : {
show: true,
lineStyle: {
color: 'green',
type: 'solid',
width: 2,
}
},
axisTick : {
show:true,
length: 10,
lineStyle: {
color: '#000',
type: 'solid',
width: 2
}
},
data : ['水稻的生长周期']
},
],
xAxis: {
type: 'value',
axisLabel : {
formatter: function (value,index) {
// value格式化成月/日,只在第一个刻度显示年份
var date = new Date(2017,03);
var texts = [];
if (index === 1) {
texts = [(date.getMonth()+1), date.getDate()];
texts.unshift(date.getFullYear());
}
else {
texts = [(date.getFullYear()),(date.getMonth() + parseInt(index)), date.getDate()];
}
return texts.join('-');
}
}
},
series: [
{
name: '播种期',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true,
position: 'insideRight'
}
},
data: [5,]
},
{
name: '出苗期',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true,
position: 'insideRight'
}
},
data: [17,]
},
{
name: '移栽期',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true,
position: 'insideRight'
}
},
data: [20, ]
},
{
name: '返青期',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true,
position: 'insideRight'
}
},
data: [35,]
},
{
name: '抽穗期',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true,
position: 'insideRight'
}
},
data: [10,]
},
{
name: '成熟期',
type: 'bar',
stack: '总量',
label: {
normal: {
show: true,
position: 'insideRight'
}
},
data: [50,]
}
]
});
</script>
ECharts
最新推荐文章于 2023-08-24 14:12:43 发布