提交 41d9690a 编写于 作者: L lang

Line connectNulls, Fix #3009, #2579

上级 87fc7a39
...@@ -53,14 +53,6 @@ define(function(require) { ...@@ -53,14 +53,6 @@ define(function(require) {
// label: { // label: {
// normal: { // normal: {
// show: false // show: false
// formatter: 标签文本格式器,同Tooltip.formatter,不支持异步回调
// // 默认自适应,水平布局为'top',垂直布局为'right',可选为
// // 'inside' | 'insideleft' | 'insideTop' | 'insideRight' | 'insideBottom' |
// // 'outside' |'left' | 'right'|'top'|'bottom'
// position:
// textStyle: null // 默认使用全局文本样式,详见TEXTSTYLE
// } // }
// }, // },
itemStyle: { itemStyle: {
......
...@@ -33,29 +33,12 @@ define(function(require) { ...@@ -33,29 +33,12 @@ define(function(require) {
label: { label: {
normal: { normal: {
// show: false,
position: 'top' position: 'top'
// formatter: 标签文本格式器,同Tooltip.formatter,不支持异步回调
// position: 默认自适应,水平布局为'top',垂直布局为'right',可选为
// 'inside'|'left'|'right'|'top'|'bottom'
// textStyle: null // 默认使用全局文本样式,详见TEXTSTYLE
} }
// emphasis: {
// show: false,
// position: 'top'
// formatter: 标签文本格式器,同Tooltip.formatter,不支持异步回调
// position: 默认自适应,水平布局为'top',垂直布局为'right',可选为
// 'inside'|'left'|'right'|'top'|'bottom'
// textStyle: null // 默认使用全局文本样式,详见TEXTSTYLE
// }
}, },
// itemStyle: { // itemStyle: {
// normal: { // normal: {},
// // color: 各异 // emphasis: {}
// },
// emphasis: {
// // color: 各异,
// }
// }, // },
lineStyle: { lineStyle: {
normal: { normal: {
...@@ -63,24 +46,27 @@ define(function(require) { ...@@ -63,24 +46,27 @@ define(function(require) {
type: 'solid' type: 'solid'
} }
}, },
// areaStyle: { // areaStyle: {},
// },
// smooth: false, smooth: false,
// smoothMonotone: null, smoothMonotone: null,
// 拐点图形类型 // 拐点图形类型
symbol: 'emptyCircle', symbol: 'emptyCircle',
// 拐点图形大小 // 拐点图形大小
symbolSize: 4, symbolSize: 4,
// 拐点图形旋转控制 // 拐点图形旋转控制
// symbolRotate: null, symbolRotate: null,
// 是否显示 symbol, 只有在 tooltip hover 的时候显示 // 是否显示 symbol, 只有在 tooltip hover 的时候显示
showSymbol: true, showSymbol: true,
// 标志图形默认只有主轴显示(随主轴标签间隔隐藏策略) // 标志图形默认只有主轴显示(随主轴标签间隔隐藏策略)
// showAllSymbol: false showAllSymbol: false,
//
// 大数据过滤,'average', 'max', 'min', 'sum' // 是否连接断点
// sampling: 'none' connectNulls: false,
// 数据过滤,'average', 'max', 'min', 'sum'
sampling: 'none',
animationEasing: 'linear' animationEasing: 'linear'
} }
......
...@@ -306,7 +306,8 @@ define(function(require) { ...@@ -306,7 +306,8 @@ define(function(require) {
smooth = getSmooth(seriesModel.get('smooth')); smooth = getSmooth(seriesModel.get('smooth'));
polyline.setShape({ polyline.setShape({
smooth: smooth, smooth: smooth,
smoothMonotone: seriesModel.get('smoothMonotone') smoothMonotone: seriesModel.get('smoothMonotone'),
connectNulls: seriesModel.get('connectNulls')
}); });
if (polygon) { if (polygon) {
...@@ -330,7 +331,8 @@ define(function(require) { ...@@ -330,7 +331,8 @@ define(function(require) {
polygon.setShape({ polygon.setShape({
smooth: smooth, smooth: smooth,
stackedOnSmooth: stackedOnSmooth, stackedOnSmooth: stackedOnSmooth,
smoothMonotone: seriesModel.get('smoothMonotone') smoothMonotone: seriesModel.get('smoothMonotone'),
connectNulls: seriesModel.get('connectNulls')
}); });
} }
......
...@@ -15,14 +15,26 @@ define(function (require) { ...@@ -15,14 +15,26 @@ define(function (require) {
var cp0 = []; var cp0 = [];
var cp1 = []; var cp1 = [];
function isPointNull(p) {
return isNaN(p[0]) || isNaN(p[1]);
}
function drawSegment( function drawSegment(
ctx, points, start, stop, len, ctx, points, start, segLen, allLen,
dir, smoothMin, smoothMax, smooth, smoothMonotone dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls
) { ) {
var prevIdx = 0;
var idx = start; var idx = start;
for (var k = 0; k < len; k++) { for (var k = 0; k < segLen; k++) {
var p = points[idx]; var p = points[idx];
if (idx >= stop || idx < 0 || isNaN(p[0]) || isNaN(p[1])) { if (idx >= allLen || idx < 0) {
break;
}
if (isPointNull(p)) {
if (connectNulls) {
idx += dir;
continue;
}
break; break;
} }
...@@ -32,21 +44,26 @@ define(function (require) { ...@@ -32,21 +44,26 @@ define(function (require) {
} }
else { else {
if (smooth > 0) { if (smooth > 0) {
var prevIdx = idx - dir;
var nextIdx = idx + dir; var nextIdx = idx + dir;
var nextP = points[nextIdx];
if (connectNulls) {
// Find next point not null
while (nextP && isPointNull(points[nextIdx])) {
nextIdx += dir;
nextP = points[nextIdx];
}
}
var ratioNextSeg = 0.5; var ratioNextSeg = 0.5;
var prevP = points[prevIdx]; var prevP = points[prevIdx];
var nextP = points[nextIdx]; var nextP = points[nextIdx];
// Last point // Last point
if ((dir > 0 && (idx === len - 1 || isNaN(nextP[0]) || isNaN(nextP[1]))) if (!nextP || isPointNull(nextP)) {
|| (dir <= 0 && (idx === 0 || isNaN(nextP[0]) || isNaN(nextP[1])))
) {
v2Copy(cp1, p); v2Copy(cp1, p);
} }
else { else {
// If next data is null // If next data is null in not connect case
if (isNaN(nextP[0]) || isNaN(nextP[1])) { if (isPointNull(nextP) && !connectNulls) {
nextP = p; nextP = p;
} }
...@@ -88,6 +105,7 @@ define(function (require) { ...@@ -88,6 +105,7 @@ define(function (require) {
} }
} }
prevIdx = idx;
idx += dir; idx += dir;
} }
...@@ -125,7 +143,9 @@ define(function (require) { ...@@ -125,7 +143,9 @@ define(function (require) {
smoothConstraint: true, smoothConstraint: true,
smoothMonotone: null smoothMonotone: null,
connectNulls: false
}, },
style: { style: {
...@@ -142,11 +162,24 @@ define(function (require) { ...@@ -142,11 +162,24 @@ define(function (require) {
var result = getBoundingBox(points, shape.smoothConstraint); var result = getBoundingBox(points, shape.smoothConstraint);
if (shape.connectNulls) {
// Must remove first and last null values avoid draw error in polygon
for (; len > 0; len--) {
if (!isPointNull(points[len - 1])) {
break;
}
}
for (; i < len; i++) {
if (!isPointNull(points[i])) {
break;
}
}
}
while (i < len) { while (i < len) {
i += drawSegment( i += drawSegment(
ctx, points, i, len, len, ctx, points, i, len, len,
1, result.min, result.max, shape.smooth, 1, result.min, result.max, shape.smooth,
shape.smoothMonotone shape.smoothMonotone, shape.connectNulls
) + 1; ) + 1;
} }
} }
...@@ -168,7 +201,9 @@ define(function (require) { ...@@ -168,7 +201,9 @@ define(function (require) {
smoothConstraint: true, smoothConstraint: true,
smoothMonotone: null smoothMonotone: null,
connectNulls: false
}, },
buildPath: function (ctx, shape) { buildPath: function (ctx, shape) {
...@@ -180,16 +215,30 @@ define(function (require) { ...@@ -180,16 +215,30 @@ define(function (require) {
var smoothMonotone = shape.smoothMonotone; var smoothMonotone = shape.smoothMonotone;
var bbox = getBoundingBox(points, shape.smoothConstraint); var bbox = getBoundingBox(points, shape.smoothConstraint);
var stackedOnBBox = getBoundingBox(stackedOnPoints, shape.smoothConstraint); var stackedOnBBox = getBoundingBox(stackedOnPoints, shape.smoothConstraint);
if (shape.connectNulls) {
// Must remove first and last null values avoid draw error in polygon
for (; len > 0; len--) {
if (!isPointNull(points[len - 1])) {
break;
}
}
for (; i < len; i++) {
if (!isPointNull(points[i])) {
break;
}
}
}
while (i < len) { while (i < len) {
var k = drawSegment( var k = drawSegment(
ctx, points, i, len, len, ctx, points, i, len, len,
1, bbox.min, bbox.max, shape.smooth, 1, bbox.min, bbox.max, shape.smooth,
smoothMonotone smoothMonotone, shape.connectNulls
); );
drawSegment( drawSegment(
ctx, stackedOnPoints, i + k - 1, len, k, ctx, stackedOnPoints, i + k - 1, k, len,
-1, stackedOnBBox.min, stackedOnBBox.max, shape.stackedOnSmooth, -1, stackedOnBBox.min, stackedOnBBox.max, shape.stackedOnSmooth,
smoothMonotone smoothMonotone, shape.connectNulls
); );
i += k + 1; i += k + 1;
......
...@@ -70,6 +70,7 @@ define(function(require) { ...@@ -70,6 +70,7 @@ define(function(require) {
zrUtil.merge(option, this.getDefaultOption()); zrUtil.merge(option, this.getDefaultOption());
// Default label emphasis `position` and `show` // Default label emphasis `position` and `show`
// FIXME Set label in merge
modelUtil.defaultEmphasis( modelUtil.defaultEmphasis(
option.label, ['position', 'show', 'textStyle', 'distance', 'formatter'] option.label, ['position', 'show', 'textStyle', 'distance', 'formatter']
); );
......
...@@ -33,6 +33,11 @@ ...@@ -33,6 +33,11 @@
var data2 = []; var data2 = [];
var data3 = []; var data3 = [];
xAxisData.push('类目' + -1);
data1.push('-');
data2.push('-');
data3.push('-');
for (var i = 0; i < 5; i++) { for (var i = 0; i < 5; i++) {
xAxisData.push('类目' + i); xAxisData.push('类目' + i);
data1.push((-Math.random() - 0.2).toFixed(3)); data1.push((-Math.random() - 0.2).toFixed(3));
...@@ -51,6 +56,10 @@ ...@@ -51,6 +56,10 @@
data2.push((Math.random() + 0.3).toFixed(3)); data2.push((Math.random() + 0.3).toFixed(3));
data3.push((Math.random() + 0.2).toFixed(3)); data3.push((Math.random() + 0.2).toFixed(3));
} }
xAxisData.push('类目' + i);
data1.push('-');
data2.push('-');
data3.push('-');
var itemStyle = { var itemStyle = {
normal: { normal: {
...@@ -103,7 +112,8 @@ ...@@ -103,7 +112,8 @@
symbolSize: 10, symbolSize: 10,
data: data1, data: data1,
itemStyle: itemStyle, itemStyle: itemStyle,
smooth: true smooth: true,
connectNulls: true
}, { }, {
name: 'line2', name: 'line2',
type: 'line', type: 'line',
...@@ -111,6 +121,7 @@ ...@@ -111,6 +121,7 @@
symbolSize: 10, symbolSize: 10,
data: data2, data: data2,
itemStyle: itemStyle, itemStyle: itemStyle,
connectNulls: true,
smooth: true smooth: true
}, { }, {
name: 'line3', name: 'line3',
...@@ -124,6 +135,7 @@ ...@@ -124,6 +135,7 @@
show: true show: true
} }
}, },
connectNulls: true,
smooth: true smooth: true
}] }]
}); });
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册