没数据时无法显示chartecharts 折线配置项内容和展示

1. 在没有数据时，chart无法显示。之前使用的3.2.3版本在这种情况是会显示yAxis的splitLine的。这样一片空白但是显示x轴y轴的名字有点奇怪？ 2. gallery能切换echarts版本么？

      option = {
    textStyle: {
        fontSize:24
    },
    tooltip: {
    	trigger: "axis"
  //  	formatter: function (params) {
  //  		// console.log(params[0].value[0]);
        //     return params[0].value[0] + " / " + params[0].value[1];
        // }
    },
    grid: {
       	left: "6%",
       	right: "3%"
    },
    legend: {
    	left : "right",
    	top: "20", //离容器上侧的距离
    	right: "200", //离容器右侧的距离
    	aligh: "right",
        data:[{
        	//	name: this.option.oBundle.getText("AlertState"),
           //name: "Alert State",
           icon: "square",
           textStyle: {
              color: "#222222",
              fontSize: "13px",
              fontFamily: "Arial"
           }
        }]
    },
    xAxis: {
    	name: "Time Period",
    	nameLocation: "middle",
    	nameGap: "40",
    	nameTextStyle: {
    		fontSize: "16",
    		fontWeight: "500",
    		fontStyle: "normal",
    		fontFamily: "Arial"
    	},
    	data: [],
    	axisLine: {
			show: false
		},
		axisTick: {
			show: false
		},
        splitLine: {
        	show: false
        }
    },
    yAxis: {
    	max: 'dataMax',
    	min: 'dataMin',
    	// name: "Fatigue",
    	nameTextStyle: {
    		fontSize: "20",
    		fontWeight: "500",
    		fontStyle: "normal",
    		fontFamily: "Arial"
    	},
        type: "value",
        axisLabel: {
        	show: true,
        	formatter: function (value) {
        		return value.toFixed(2);
        	}
        },
        axisLine: {
			show: true,
			interval: 1
		},
		axisTick: {
			show: false
		},
        splitLine: {
            show: true,
            interval: 1
        }
    },
    series: [{
        type: 'line',
        showSymbol: false,
        hoverAnimation: false,
        data: [],
        itemStyle: {
        	normal: {
        		color: '#199CD8',
        		borderColor: '#fff',
        		borderWith: 1,
        	    shadowBlur: 2,
                shadowOffsetX: 2,
                shadowOffsetY: 5
        	}
        },
        lineStyle: {
            normal: {
                width: 2,
                shadowColor: 'rgba(112, 155, 233, 0.5)',
                shadowBlur: 4,
                shadowOffsetY: 4
            }
        }
    },
	//为了调色用
	{
		name: "Alert State",
		type: 'line',
		itemStyle: {
        	normal: {
        		color: 'rgba(251,222,222,0.5)'
        	}
    	},
    	markLine: {
        	silent: true,
        	symbol: false,
        	animation: false,
        	label: {
        		normal: {
        			show: false
        		}
        	},
        	data: [{
        		yAxis: -0.10
        	}],
        	lineStyle: {
        		normal: {
        			type: "solid",
            		color: "#CE1C08"
        		}
            }
        },
        markArea: {
        	//图形是否不响应和触发鼠标事件，默认为 false，即响应和触发鼠标事件。markArea 默认的 z 比较大会覆盖在上面.
        	silent: true,
	    	itemStyle: {
	        	normal: {
	        		color: "rgba(251,222,222,0.5)",
	        		borderColor: "#CE1C08",
	        		borderWith: 1
	        	}
	        },
            data: [
                [{
                    coord: 0
                }, {
                    yAxis: 4.10
                }]
            ]
        }
	}]
};

option.yAxis.name = "Fatigue";
option.series[1].name = "Alert State";
option.legend.data[0].name = "Alert State";
// option.xAxis.name = "TimePeriod";

function randomData() {
    now = new Date(+now + oneMinute);
    var fatigue = Math.random() * 2 - 1;
    return {
        value: [
            [now.getHours(), now.getMinutes()].join(":"),
            Math.round(fatigue * 100) / 100
        ]
    };
}

// var now = +new Date();
// var oneMinute = 60 * 1000;
// var data = [];
// var x = [];
// // for (var i = 0; i < 50; i++) {
//     var item = randomData();
//     data.push(item)
//     x.push(item.value[0])
// // }

// option.xAxis.data = x;
// option.series[0].data = data;