_buildTextShape: function (data, seriesIndex) {
var series = this.series;
var serie = series[seriesIndex];
var serieName = serie.name || '';
var data = data;
var dataIndex = data.dataIndex;
var queryTarget = [
data,
serie
];
// dataRange 选择结束
var legend = this.component.legend;
var defaultColor = legend ? legend.getColor(serieName) : this.zr.getColor(seriesIndex);
// 多级控制
var normal = this.deepMerge(queryTarget, 'itemStyle.normal') || {};
var emphasis = this.deepMerge(queryTarget, 'itemStyle.emphasis') || {};
var normalColor = this.getItemStyleColor(normal.color, seriesIndex, dataIndex, data)
|| defaultColor;
var emphasisColor = this.getItemStyleColor(
emphasis.color, seriesIndex, dataIndex, data
)
|| (typeof normalColor === 'string'
? zrColor.lift(normalColor, -0.2)
: normalColor
);
var textShape = new TextShape({
zlevel: serie.zlevel,
z: serie.z,
hoverable: true,
clickable: this.deepQuery(queryTarget, 'clickable'),
style: {
x: 0,
y: 0,
text: data.text,
color: normalColor,
textFont: [data.style,
data.weight,
data.size + 'px',
data.font].join(' '),
textBaseline: 'alphabetic',
textAlign: 'center'
},
highlightStyle: {
brushType: emphasis.borderWidth ? 'both' : 'fill',
color: emphasisColor,
lineWidth: emphasis.borderWidth || 0,
strokeColor: emphasis.borderColor
},
position: [
data.x,
data.y
],
rotation: [
-data.rotate / 180 * Math.PI,
0,
0
]
});
ecData.pack(
textShape,
serie, seriesIndex,
data, dataIndex,
data.name
);
this.shapeList.push(textShape);
}
_getBarItem: function (seriesIndex, dataIndex, name, x, y, width, height, orient) {
var series = this.series;
var barShape;
var serie = series[seriesIndex];
var data = serie.data[dataIndex];
// 多级控制
var defaultColor = this._sIndex2ColorMap[seriesIndex];
var queryTarget = [data, serie];
var normal = this.deepMerge(queryTarget, 'itemStyle.normal');
var emphasis = this.deepMerge(queryTarget, 'itemStyle.emphasis');
var normalBorderWidth = normal.barBorderWidth;
barShape = {
zlevel: serie.zlevel,
z: serie.z,
clickable: this.deepQuery(queryTarget, 'clickable'),
style: {
x: x,
y: y,
width: width,
height: height,
brushType: 'both',
color: this.getItemStyleColor(
this.deepQuery(queryTarget, 'itemStyle.normal.color') || defaultColor,
seriesIndex, dataIndex, data
),
radius: normal.barBorderRadius,
lineWidth: normalBorderWidth,
strokeColor: normal.barBorderColor
},
highlightStyle: {
color: this.getItemStyleColor(
this.deepQuery(queryTarget, 'itemStyle.emphasis.color'),
seriesIndex, dataIndex, data
),
radius: emphasis.barBorderRadius,
lineWidth: emphasis.barBorderWidth,
strokeColor: emphasis.barBorderColor
},
_orient: orient
};
var barShapeStyle = barShape.style;
barShape.highlightStyle.color = barShape.highlightStyle.color
|| (typeof barShapeStyle.color === 'string'
? zrColor.lift(barShapeStyle.color, -0.3)
: barShapeStyle.color
);
//亚像素优化
barShapeStyle.x = Math.floor(barShapeStyle.x);
barShapeStyle.y = Math.floor(barShapeStyle.y);
barShapeStyle.height = Math.ceil(barShapeStyle.height);
barShapeStyle.width = Math.ceil(barShapeStyle.width);
// 考虑线宽的显示优化
if (normalBorderWidth > 0
&& barShapeStyle.height > normalBorderWidth
&& barShapeStyle.width > normalBorderWidth
) {
barShapeStyle.y += normalBorderWidth / 2;
barShapeStyle.height -= normalBorderWidth;
barShapeStyle.x += normalBorderWidth / 2;
barShapeStyle.width -= normalBorderWidth;
}
else {
// 太小了或者线宽小于0，废了边线
barShapeStyle.brushType = 'fill';
}
barShape.highlightStyle.textColor = barShape.highlightStyle.color;
barShape = this.addLabel(barShape, serie, data, name, orient);
var barShapeStyleList = [ // normal emphasis都需要检查
barShapeStyle,
barShape.highlightStyle
];
for (var i = 0, l = barShapeStyleList.length; i < l; i++) {
var textPosition = barShapeStyleList[i].textPosition;
if (textPosition === 'insideLeft'
|| textPosition === 'insideRight'
|| textPosition === 'insideTop'
|| textPosition === 'insideBottom'
) {
var gap = 5;
switch (textPosition) {
case 'insideLeft':
barShapeStyleList[i].textX = barShapeStyle.x + gap;
barShapeStyleList[i].textY = barShapeStyle.y + barShapeStyle.height / 2;
barShapeStyleList[i].textAlign = 'left';
barShapeStyleList[i].textBaseline = 'middle';
break;
case 'insideRight':
barShapeStyleList[i].textX = barShapeStyle.x + barShapeStyle.width - gap;
barShapeStyleList[i].textY = barShapeStyle.y + barShapeStyle.height / 2;
barShapeStyleList[i].textAlign = 'right';
barShapeStyleList[i].textBaseline = 'middle';
break;
case 'insideTop':
barShapeStyleList[i].textX = barShapeStyle.x + barShapeStyle.width / 2;
barShapeStyleList[i].textY = barShapeStyle.y + gap / 2;
barShapeStyleList[i].textAlign = 'center';
barShapeStyleList[i].textBaseline = 'top';
break;
case 'insideBottom':
barShapeStyleList[i].textX = barShapeStyle.x + barShapeStyle.width / 2;
barShapeStyleList[i].textY = barShapeStyle.y + barShapeStyle.height - gap / 2;
barShapeStyleList[i].textAlign = 'center';
barShapeStyleList[i].textBaseline = 'bottom';
break;
}
barShapeStyleList[i].textPosition = 'specific';
barShapeStyleList[i].textColor = barShapeStyleList[i].textColor || '#fff';
}
}
if (this.deepQuery([data, serie, this.option],'calculable')) {
this.setCalculable(barShape);
barShape.draggable = true;
}
ecData.pack(
barShape,
series[seriesIndex], seriesIndex,
series[seriesIndex].data[dataIndex], dataIndex,
name
);
return barShape;
},