diff --git a/doc/asset/js/echartsConfig.js b/doc/asset/js/echartsConfig.js index 66e0d3b88c82bd75d4c7b139d6c7e3818a670789..4c45d9c4055064b60f49a34eb2708912f5e24e51 100644 --- a/doc/asset/js/echartsConfig.js +++ b/doc/asset/js/echartsConfig.js @@ -147,6 +147,8 @@ // 类目轴 categoryAxis: { position: 'bottom', // 位置 + name: '', // 坐标轴名字,默认为空 + nameLocation: 'end', // 坐标轴名字位置,支持'start' | 'end' boundaryGap: true, // 类目起始和结束两端空白策略 axisLine: { // 坐标轴线 show: true, // 默认显示,属性show控制显示与否 @@ -193,6 +195,8 @@ // 数值型坐标轴默认参数 valueAxis: { position: 'left', // 位置 + name: '', // 坐标轴名字,默认为空 + nameLocation: 'end', // 坐标轴名字位置,支持'start' | 'end' boundaryGap: [0, 0], // 数值起始和结束两端空白策略 // min: null, // 最小值 // max: null, // 最大值 @@ -260,7 +264,11 @@ // color: 各异, lineStyle: { width: 1, - style: 'solid' + style: 'solid', + shadowColor : 'rgba(0,0,0,0)', //默认透明 + shadowBlur: 5, + shadowOffsetX: 3, + shadowOffsetY: 3 } }, emphasis: { diff --git a/doc/doc.html b/doc/doc.html index 308fc933c1f970e10e567249dbaa4b93c3e84dbe..da660d6baf5ec02eb98b166a707165ea12399638 100644 --- a/doc/doc.html +++ b/doc/doc.html @@ -1035,6 +1035,18 @@ feature : { 通用 坐标轴类型,横轴默认为类目型'bottom',纵轴默认为数值型'left',可选为:'bottom' | 'top' | 'left' | 'right' + + {string} name + '' + 数值型 + 坐标轴名称,默认为空 + + + {string} nameLocation + 'end' + 数值型 + 坐标轴名称位置,默认为'end',可选为:'start' | 'end' + {boolean} boundaryGap true diff --git a/doc/example/mix1.html b/doc/example/mix1.html index 2c28d825303a5c1df883d1c96f7ea510fbbc2db6..57c22835c04a33d83160ff57b28f9cc7203ebd3f 100644 --- a/doc/example/mix1.html +++ b/doc/example/mix1.html @@ -93,6 +93,7 @@ option = { yAxis : [ { type : 'value', + name : '水量', axisLabel : { formatter: '{value} ml' }, @@ -100,6 +101,7 @@ option = { }, { type : 'value', + name : '温度', axisLabel : { formatter: '{value} °C' }, diff --git a/src/component/valueAxis.js b/src/component/valueAxis.js index 975179916e9724a0f628b5cc8f329e72ce2438c1..b393d89a70dc5693299d92e5d5bcbc5b34238883 100644 --- a/src/component/valueAxis.js +++ b/src/component/valueAxis.js @@ -64,17 +64,17 @@ define(function (require) { case 'left' : axShape.style = { xStart : grid.getX(), - yStart : grid.getY(), + yStart : grid.getYend(), xEnd : grid.getX(), - yEnd : grid.getYend() + yEnd : grid.getY() }; break; case 'right' : axShape.style = { xStart : grid.getXend(), - yStart : grid.getY(), + yStart : grid.getYend(), xEnd : grid.getXend(), - yEnd : grid.getYend() + yEnd : grid.getY() }; break; case 'bottom' : @@ -94,7 +94,10 @@ define(function (require) { }; break; } - + if (option.name !== '') { + axShape.style.text = option.name; + axShape.style.textPosition = option.nameLocation; + } axShape.style.strokeColor = option.axisLine.lineStyle.color; axShape.style.lineWidth = option.axisLine.lineStyle.width; axShape.style.lineType = option.axisLine.lineStyle.type; @@ -190,7 +193,11 @@ define(function (require) { color : textStyle.color, text : _valueLabel[i], textFont : self.getFont(textStyle), - textAlign : 'center', + textAlign : i === 0 + ? 'left' + : i == (dataLength - 1) + ? 'right' + : 'center', textBaseline : baseLine } }; @@ -234,9 +241,14 @@ define(function (require) { text : _valueLabel[i], textFont : self.getFont(textStyle), textAlign : align, - textBaseline : 'middle' + textBaseline : i === 0 + ? 'bottom' + : (i == dataLength - 1) + ? 'top' + : 'middle' } }; + if (rotate) { axShape.rotation = [ rotate * Math.PI / 180, diff --git a/src/config.js b/src/config.js index 7c2c0977e381ae5151f780c7b066452797eaa9fa..b7cd939d5cc40ec52b60aa5f5a4c745910ba3d7a 100644 --- a/src/config.js +++ b/src/config.js @@ -178,6 +178,8 @@ define(function() { // 类目轴 categoryAxis: { position: 'bottom', // 位置 + name: '', // 坐标轴名字,默认为空 + nameLocation: 'end', // 坐标轴名字位置,支持'start' | 'end' boundaryGap: true, // 类目起始和结束两端空白策略 axisLine: { // 坐标轴线 show: true, // 默认显示,属性show控制显示与否 @@ -225,6 +227,8 @@ define(function() { // 数值型坐标轴默认参数 valueAxis: { position: 'left', // 位置 + name: '', // 坐标轴名字,默认为空 + nameLocation: 'end', // 坐标轴名字位置,支持'start' | 'end' boundaryGap: [0, 0], // 数值起始和结束两端空白策略 // min: null, // 最小值 // max: null, // 最大值