<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>