echarts 橫座標分行展示,以及文字顯示頂部

X軸文字 分行展示

xAxis : [
                                {
                                    splitLine:{show:false},
                                    type : 'category',
                                    data : ['社交人際','溝通交流','心理認知','遊戲玩耍','大小運動','生活自理','執行管控','知識常識'],
                                    splitArea:{show:false},
                                    axisLabel: {
                                        show: true,
                                        interval:0,
                                        formatter:function(params) {
                                            var newParamsName = "";
                                            var paramsNameNumber = params.length;
                                            var provideNumber = 2;  //一行顯示幾個字
                                            var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
                                            if (paramsNameNumber > provideNumber) {
                                                for (var p = 0; p < rowNumber; p++) {
                                                    var tempStr = "";
                                                    var start = p * provideNumber;
                                                    var end = start + provideNumber;
                                                    if (p == rowNumber - 1) {
                                                        tempStr = params.substring(start, paramsNameNumber);
                                                    } else {
                                                        tempStr = params.substring(start, end) + "\n";
                                                    }
                                                    newParamsName += tempStr;
                                                }

                                            } else {
                                                newParamsName = params;
                                            }
                                            return newParamsName
                                        },
                                        textStyle: {
                                            color: '#6861a6' //文字顏色
                                        }
                                    }
                                },

  文字上方顯示

series: [
         {type: 'bar',
         itemStyle: {
         	normal: {
         		label: {
											show: true, //開啓顯示
											position: 'top', //在上方顯示
											textStyle: { //數值樣式
												color: 'black',
												fontSize: 16
											}
										}
									}
								}
							},
							{type: 'bar',
							itemStyle: {
								normal: {
									label: {
									show: true, //開啓顯示
									position: 'top', //在上方顯示
									textStyle: { //數值樣式
										color: 'black',
										fontSize: 16
									}
								}
							}
						}
					}

					]

  數組分批插入

objdis=[]; 
objname=[]; objnames=[]; 
objyd=[]; 
objyds=[];objydss=[];
objad=[]; 
for (var i = 0; i < $(".disyd").length-1; i++) {
	objname[i]=parseInt($(".disname:eq("+i+")").text());
	objyd[i]  =parseInt($(".disyd:eq("+i+")").text());
	objyds[i]  =parseInt($(".disyd:eq("+i+")").text());
	objydss[i]  =parseInt($(".disyd:eq("+i+")").text());
	objad[i]  =parseInt($(".disad:eq("+i+")").text());	

}


zhuanhuans(objname,objyd) ;
zhuanhuans(objad,objyds) ;
zhuanhuans(disease_name,objydss) ;

for (var i = 0; i < $(".disyd").length-1; i++) {

	objdis[i] = [disease_name[i],objyd[i],objad[i]]
}

objdis.unshift(['日期','到診','對話量']) 	

  

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章