提交 35465f14 编写于 作者: K kener

文本换行支持

上级 47148ffc
......@@ -735,7 +735,7 @@ require(['echarts'], function(ec){
<tr>
<td> {string} text </td>
<td> '' </td>
<td> 主标题文本 </td>
<td> 主标题文本,'\n'指定换行 </td>
</tr>
<tr>
<td> {string} link </td>
......@@ -745,7 +745,7 @@ require(['echarts'], function(ec){
<tr>
<td> {string} subtext </td>
<td> '' </td>
<td> 副标题文本 </td>
<td> 副标题文本,'\n'指定换行 </td>
</tr>
<tr>
<td> {string} sublink </td>
......@@ -990,7 +990,7 @@ require(['echarts'], function(ec){
<tr>
<td> {Array} text </td>
<td> null </td>
<td> 值域文字显示,splitNumber生效时默认以计算所得数值作为值域文字显示,可指定长度为2的文本数组显示简介的值域文本,如['高', '低']</td>
<td> 值域文字显示,splitNumber生效时默认以计算所得数值作为值域文字显示,可指定长度为2的文本数组显示简介的值域文本,如['高', '低'],'\n'指定换行</td>
</tr>
<tr>
<td> {Object} textStyle </td>
......@@ -1763,8 +1763,7 @@ feature : {
</table>
<h5>axis.data<a name="AxisData"> </a></h5>
<P> 类目型坐标轴文本标签数组,指定label内容。
数组项通常为文本,如:</P>
<P> 类目型坐标轴文本标签数组,指定label内容。 数组项通常为文本,'\n'指定换行,如:</P>
<div class="code">
<pre>[&#39;Jan&#39;, &#39;Feb&#39;, &#39;Mar&#39;, &#39;Apr&#39;, &#39;May&#39;, &#39;Jun&#39;, ..., &#39;Dec&#39;]
</pre>
......@@ -2721,7 +2720,7 @@ geoCoord : {
<tr>
<td> {string} text </td>
<td> 'Loading...' </td>
<td> 显示话术 </td>
<td> 显示话术 ,'\n'指定换行</td>
</tr>
<tr>
<td> {string | number} x </td>
......
......@@ -294,7 +294,7 @@ define(function(require) {
) || {};
shape.style.textColor = labelStyle.color || '#fff';
shape.style.textAlign = labelStyle.align || 'center';
shape.style.textBaseLine = labelStyle.baseline || 'middle';
shape.style.textBaseline = labelStyle.baseline || 'middle';
shape.style.textFont = self.getFont(labelStyle);
}
......@@ -307,7 +307,7 @@ define(function(require) {
shape.highlightStyle.textColor = labelStyle.color || '#fff';
shape.highlightStyle.textAlign = labelStyle.align
|| 'center';
shape.highlightStyle.textBaseLine = labelStyle.baseline
shape.highlightStyle.textBaseline = labelStyle.baseline
|| 'middle';
shape.highlightStyle.textFont = self.getFont(labelStyle);
}
......
......@@ -332,7 +332,7 @@ define(function(require) {
queryTarget,
'itemStyle.normal.label.textStyle.align'
) || 'center';
sector.style.textBaseLine = self.deepQuery(
sector.style.textBaseline = self.deepQuery(
queryTarget,
'itemStyle.normal.label.textStyle.baseline'
) || 'middle';
......@@ -370,7 +370,7 @@ define(function(require) {
queryTarget,
'itemStyle.emphasis.label.textStyle.align'
) || 'center';
sector.highlightStyle.textBaseLine = self.deepQuery(
sector.highlightStyle.textBaseline = self.deepQuery(
queryTarget,
'itemStyle.normal.label.textStyle.baseline'
) || 'middle';
......
......@@ -668,8 +668,13 @@ define(function (require) {
// 根据类目轴数据索引换算类目轴名称
function getNameByIndex(dataIndex) {
if (typeof option.data[dataIndex].value != 'undefined') {
return option.data[dataIndex].value;
}
else {
return option.data[dataIndex];
}
}
// 根据类目轴数据索引换算类目轴名称
function getIndexByName(name) {
......
......@@ -81,7 +81,7 @@ define(function (require) {
var itemWidth = dataRangeOption.itemWidth;
var itemHeight = dataRangeOption.itemHeight;
var itemGap = dataRangeOption.itemGap;
var textHeight = zrArea.getTextWidth('', font);
var textHeight = zrArea.getTextHeight('', font);
var color;
if (dataRangeOption.orient == 'vertical'
......@@ -108,6 +108,8 @@ define(function (require) {
}
else {
lastY += textHeight + _textGap;
textShape.style.y += textHeight / 2 + _textGap;
textShape.style.textBaseline = 'bottom';
}
self.shapeList.push(textShape);
}
......@@ -179,6 +181,11 @@ define(function (require) {
lastX, lastY, dataRangeOption.text[1]
);
if (dataRangeOption.orient != 'horizontal') {
textShape.style.y -= 5;
textShape.style.textBaseline = 'top';
}
self.shapeList.push(textShape);
}
}
......@@ -195,7 +202,7 @@ define(function (require) {
var lastY = _itemGroupLocation.y;
var itemWidth = dataRangeOption.itemWidth;
var itemHeight = dataRangeOption.itemHeight;
var textHeight = zrArea.getTextWidth('', font);
var textHeight = zrArea.getTextHeight('', font);
var needValueText = true;
......@@ -215,6 +222,8 @@ define(function (require) {
}
else {
lastY += textHeight + _textGap;
textShape.style.y += textHeight / 2 + _textGap;
textShape.style.textBaseline = 'bottom';
}
self.shapeList.push(textShape);
}
......@@ -313,7 +322,7 @@ define(function (require) {
var height = _calculableLocation.height;
var font = self.getFont(dataRangeOption.textStyle);
var textHieght = zrArea.getTextWidth('', font) + 2;
var textHeight = zrArea.getTextHeight('', font);
var textWidth = Math.max(
zrArea.getTextWidth(
dataRangeOption.precision === 0
......@@ -344,23 +353,23 @@ define(function (require) {
// 手柄统统在下方
pointListStart = [
[x, y],
[x, y + height + textHieght / 2 * 3],
[x - textWidth, y + height + textHieght / 2 * 3],
[x - textWidth, y + height + textHieght / 2],
[x - textHieght / 2, y + height + textHieght / 2],
[x, y + height + textHeight / 2 * 3],
[x - textWidth, y + height + textHeight / 2 * 3],
[x - textWidth, y + height + textHeight / 2],
[x - textHeight / 2, y + height + textHeight / 2],
[x - 1, y + height],
[x - 1, y]
];
textXStart = x - textWidth / 2;
textYStart = y + height + textHieght;
textYStart = y + height + textHeight;
pointListEnd = [
[x + width, y],
[x + width, y + height + textHieght / 2 * 3],
[x + width + textWidth, y + height + textHieght/2*3],
[x + width + textWidth, y + height + textHieght / 2],
[x + width + textHieght / 2, y + height + textHieght/2],
[x + width, y + height + textHeight / 2 * 3],
[x + width + textWidth, y + height + textHeight/2*3],
[x + width + textWidth, y + height + textHeight / 2],
[x + width + textHeight / 2, y + height + textHeight/2],
[x + width + 1, y + height],
[x + width + 1, y]
];
......@@ -371,23 +380,23 @@ define(function (require) {
// 手柄在上方
pointListStart = [
[x, y + height],
[x, y - textHieght / 2 * 3],
[x - textWidth, y - textHieght / 2 * 3],
[x - textWidth, y - textHieght / 2],
[x - textHieght / 2, y - textHieght / 2],
[x, y - textHeight / 2 * 3],
[x - textWidth, y - textHeight / 2 * 3],
[x - textWidth, y - textHeight / 2],
[x - textHeight / 2, y - textHeight / 2],
[x - 1, y],
[x - 1, y + height]
];
textXStart = x - textWidth / 2;
textYStart = y - textHieght;
textYStart = y - textHeight;
pointListEnd = [
[x + width, y + height],
[x + width, y - textHieght / 2 * 3],
[x + width + textWidth, y - textHieght / 2 * 3],
[x + width + textWidth, y - textHieght / 2],
[x + width + textHieght / 2, y - textHieght / 2],
[x + width, y - textHeight / 2 * 3],
[x + width + textWidth, y - textHeight / 2 * 3],
[x + width + textWidth, y - textHeight / 2],
[x + width + textHeight / 2, y - textHeight / 2],
[x + width + 1, y],
[x + width + 1, y + height]
];
......@@ -396,55 +405,54 @@ define(function (require) {
}
}
else {
textWidth += textHieght;
textWidth += textHeight;
// 垂直
if (dataRangeOption.x != 'right') {
// 手柄统统在右侧
pointListStart = [
[x, y],
[x + width + textWidth, y],
[x + width + textWidth, y - textHieght],
[x + width + textHieght, y - textHieght],
[x + width + textWidth, y - textHeight],
[x + width + textHeight, y - textHeight],
[x + width, y - 1],
[x, y - 1]
];
textXStart = x + width + textWidth / 2 + textHieght / 2;
textYStart = y - textHieght / 2;
textXStart = x + width + textWidth / 2 + textHeight / 2;
textYStart = y - textHeight / 2;
pointListEnd = [
[x, y + height],
[x + width + textWidth, y + height],
[x + width + textWidth, y + textHieght + height],
[x + width + textHieght, y + textHieght + height],
[x + width + textWidth, y + textHeight + height],
[x + width + textHeight, y + textHeight + height],
[x + width, y + 1 + height],
[x, y + height + 1]
];
textXEnd = textXStart;
textYEnd = y + height + textHieght / 2;
textYEnd = y + height + textHeight / 2;
}
else {
// 手柄在左侧
pointListStart = [
[x + width, y],
[x - textWidth, y],
[x - textWidth, y - textHieght],
[x - textHieght, y - textHieght],
[x - textWidth, y - textHeight],
[x - textHeight, y - textHeight],
[x, y - 1],
[x + width, y - 1]
];
textXStart = x - textWidth / 2 - textHieght / 2;
textYStart = y - textHieght / 2;
textXStart = x - textWidth / 2 - textHeight / 2;
textYStart = y - textHeight / 2;
pointListEnd = [
[x + width, y + height],
[x - textWidth, y + height],
[x - textWidth, y + textHieght + height],
[x - textHieght, y + textHieght + height],
[x - textWidth, y + textHeight + height],
[x - textHeight, y + textHeight + height],
[x, y + 1 + height],
[x + width, y + height + 1]
];
textXEnd = textXStart;
textYEnd = y + height + textHieght / 2;
textYEnd = y + height + textHeight / 2;
}
}
......@@ -458,7 +466,7 @@ define(function (require) {
textY : textYStart,
textPosition : 'specific',
textAlign : 'center',
textBaseline : 'middle ',
textBaseline : 'middle',
textColor: dataRangeOption.textStyle.color,
color : getColor(dataRangeOption.max),
width : 0, // for ondrif计算统一
......@@ -483,7 +491,7 @@ define(function (require) {
textY : textYEnd,
textPosition : 'specific',
textAlign : 'center',
textBaseline : 'middle ',
textBaseline : 'middle',
textColor: dataRangeOption.textStyle.color,
color : getColor(dataRangeOption.min),
width : 0, // for ondrif计算统一
......@@ -576,7 +584,7 @@ define(function (require) {
var totalWidth = 0;
var totalHeight = 0;
var font = self.getFont(dataRangeOption.textStyle);
var textHeight = zrArea.getTextWidth('', font);
var textHeight = zrArea.getTextHeight('', font);
if (dataRangeOption.orient == 'horizontal') {
// 水平布局,计算总宽度
......
......@@ -167,11 +167,11 @@ define(function (require) {
zrArea.getTextWidth(text, font),
zrArea.getTextWidth(subtext, subfont)
);
var totalHeight = zrArea.getTextWidth('', font)
var totalHeight = zrArea.getTextHeight(text, font)
+ (subtext === ''
? 0
: (titleOption.itemGap
+ zrArea.getTextWidth('', subfont))
+ zrArea.getTextHeight(subtext, subfont))
);
var x;
......
......@@ -116,13 +116,13 @@ define(function (require) {
var textFont = self.getFont(toolboxOption.textStyle);
var textPosition;
var textAlign;
var textBaseLine;
var textBaseline;
if (toolboxOption.orient == 'horizontal') {
textPosition = _itemGroupLocation.y / zr.getHeight() < 0.5
? 'bottom' : 'top';
textAlign = _itemGroupLocation.x / zr.getWidth() < 0.5
? 'left' : 'right';
textBaseLine = _itemGroupLocation.y / zr.getHeight() < 0.5
textBaseline = _itemGroupLocation.y / zr.getHeight() < 0.5
? 'top' : 'bottom';
}
else {
......@@ -131,7 +131,7 @@ define(function (require) {
/*
textAlign = _itemGroupLocation.x / zr.getWidth() < 0.5
? 'right' : 'left';
textBaseLine = 'top';
textBaseline = 'top';
*/
}
......@@ -174,18 +174,18 @@ define(function (require) {
if (i === 0 && textAlign == 'left') {
itemShape.highlightStyle.textPosition = 'specific';
itemShape.highlightStyle.textAlign = textAlign;
itemShape.highlightStyle.textBaseLine = textBaseLine;
itemShape.highlightStyle.textBaseline = textBaseline;
itemShape.highlightStyle.textX = lastX;
itemShape.highlightStyle.textY = textBaseLine == 'top'
itemShape.highlightStyle.textY = textBaseline == 'top'
? lastY + itemSize + 10
: lastY - 10;
}
if (i == iconLength - 1 && textAlign == 'right') {
itemShape.highlightStyle.textPosition = 'specific';
itemShape.highlightStyle.textAlign = textAlign;
itemShape.highlightStyle.textBaseLine = textBaseLine;
itemShape.highlightStyle.textBaseline = textBaseline;
itemShape.highlightStyle.textX = lastX + itemSize;
itemShape.highlightStyle.textY = textBaseLine == 'top'
itemShape.highlightStyle.textY = textBaseline == 'top'
? lastY + itemSize + 10
: lastY - 10;
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册