From 26f5b31fc9c718b71aa28e56dc30054a6430cebc Mon Sep 17 00:00:00 2001 From: kener Date: Wed, 24 Jul 2013 19:42:52 +0800 Subject: [PATCH] =?UTF-8?q?=E6=95=B0=E5=80=BC=E5=9E=8B=E5=9D=90=E6=A0=87?= =?UTF-8?q?=E8=BD=B4=E6=94=AF=E6=8C=81=E6=98=BE=E7=A4=BA=E9=A1=B9=E7=9B=AE?= =?UTF-8?q?=E5=90=8D=E5=AD=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- doc/asset/js/echartsConfig.js | 10 +++++++++- doc/doc.html | 12 ++++++++++++ doc/example/mix1.html | 2 ++ src/component/valueAxis.js | 26 +++++++++++++++++++------- src/config.js | 4 ++++ 5 files changed, 46 insertions(+), 8 deletions(-) diff --git a/doc/asset/js/echartsConfig.js b/doc/asset/js/echartsConfig.js index 66e0d3b88..4c45d9c40 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 308fc933c..da660d6ba 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 2c28d8253..57c22835c 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 975179916..b393d89a7 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 7c2c0977e..b7cd939d5 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, // 最大值 -- GitLab