diff --git a/src/chart/bar/BarSeries.js b/src/chart/bar/BarSeries.js index 10986442b1bc0995e268c5d756586f320689086e..567cd88665fc9384fad76987b1f477d1a8176a81 100644 --- a/src/chart/bar/BarSeries.js +++ b/src/chart/bar/BarSeries.js @@ -53,14 +53,6 @@ define(function(require) { // label: { // normal: { // show: false - // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调 - - // // 默认自适应，水平布局为'top'，垂直布局为'right'，可选为 - // // 'inside' | 'insideleft' | 'insideTop' | 'insideRight' | 'insideBottom' | - // // 'outside' |'left' | 'right'|'top'|'bottom' - // position: - - // textStyle: null // 默认使用全局文本样式，详见TEXTSTYLE // } // }, itemStyle: { diff --git a/src/chart/line/LineSeries.js b/src/chart/line/LineSeries.js index 7bbe6e933e443026645bff330438512ccf4559a8..c7cc7ad39d15b5a3f4d2e49b8080e3cd4c2cdae0 100644 --- a/src/chart/line/LineSeries.js +++ b/src/chart/line/LineSeries.js @@ -33,29 +33,12 @@ define(function(require) { label: { normal: { - // show: false, 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: { - // normal: { - // // color: 各异 - // }, - // emphasis: { - // // color: 各异, - // } + // normal: {}, + // emphasis: {} // }, lineStyle: { normal: { @@ -63,24 +46,27 @@ define(function(require) { type: 'solid' } }, - // areaStyle: { - // }, - // smooth: false, - // smoothMonotone: null, + // areaStyle: {}, + + smooth: false, + smoothMonotone: null, // 拐点图形类型 symbol: 'emptyCircle', // 拐点图形大小 symbolSize: 4, // 拐点图形旋转控制 - // symbolRotate: null, + symbolRotate: null, // 是否显示 symbol, 只有在 tooltip hover 的时候显示 showSymbol: true, // 标志图形默认只有主轴显示（随主轴标签间隔隐藏策略） - // showAllSymbol: false - // - // 大数据过滤，'average', 'max', 'min', 'sum' - // sampling: 'none' + showAllSymbol: false, + + // 是否连接断点 + connectNulls: false, + + // 数据过滤，'average', 'max', 'min', 'sum' + sampling: 'none', animationEasing: 'linear' } diff --git a/src/chart/line/LineView.js b/src/chart/line/LineView.js index 4f0de0525034e783bb6e75675f3e6dc1ee98f1d6..b36b12800e0e23a00036ddff87593a3997d11b57 100644 --- a/src/chart/line/LineView.js +++ b/src/chart/line/LineView.js @@ -306,7 +306,8 @@ define(function(require) { smooth = getSmooth(seriesModel.get('smooth')); polyline.setShape({ smooth: smooth, - smoothMonotone: seriesModel.get('smoothMonotone') + smoothMonotone: seriesModel.get('smoothMonotone'), + connectNulls: seriesModel.get('connectNulls') }); if (polygon) { @@ -330,7 +331,8 @@ define(function(require) { polygon.setShape({ smooth: smooth, stackedOnSmooth: stackedOnSmooth, - smoothMonotone: seriesModel.get('smoothMonotone') + smoothMonotone: seriesModel.get('smoothMonotone'), + connectNulls: seriesModel.get('connectNulls') }); } diff --git a/src/chart/line/poly.js b/src/chart/line/poly.js index 213db5026addadc73c8cf36768b8a0f6b913deb6..0a2a998ec337ca82698f5d2c3eb438021852b5e2 100644 --- a/src/chart/line/poly.js +++ b/src/chart/line/poly.js @@ -15,14 +15,26 @@ define(function (require) { var cp0 = []; var cp1 = []; + function isPointNull(p) { + return isNaN(p[0]) || isNaN(p[1]); + } + function drawSegment( - ctx, points, start, stop, len, - dir, smoothMin, smoothMax, smooth, smoothMonotone + ctx, points, start, segLen, allLen, + dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls ) { + var prevIdx = 0; var idx = start; - for (var k = 0; k < len; k++) { + for (var k = 0; k < segLen; k++) { 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; } @@ -32,21 +44,26 @@ define(function (require) { } else { if (smooth > 0) { - var prevIdx = 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 prevP = points[prevIdx]; var nextP = points[nextIdx]; // Last point - if ((dir > 0 && (idx === len - 1 || isNaN(nextP[0]) || isNaN(nextP[1]))) - || (dir <= 0 && (idx === 0 || isNaN(nextP[0]) || isNaN(nextP[1]))) - ) { + if (!nextP || isPointNull(nextP)) { v2Copy(cp1, p); } else { - // If next data is null - if (isNaN(nextP[0]) || isNaN(nextP[1])) { + // If next data is null in not connect case + if (isPointNull(nextP) && !connectNulls) { nextP = p; } @@ -88,6 +105,7 @@ define(function (require) { } } + prevIdx = idx; idx += dir; } @@ -125,7 +143,9 @@ define(function (require) { smoothConstraint: true, - smoothMonotone: null + smoothMonotone: null, + + connectNulls: false }, style: { @@ -142,11 +162,24 @@ define(function (require) { 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) { i += drawSegment( ctx, points, i, len, len, 1, result.min, result.max, shape.smooth, - shape.smoothMonotone + shape.smoothMonotone, shape.connectNulls ) + 1; } } @@ -168,7 +201,9 @@ define(function (require) { smoothConstraint: true, - smoothMonotone: null + smoothMonotone: null, + + connectNulls: false }, buildPath: function (ctx, shape) { @@ -180,16 +215,30 @@ define(function (require) { var smoothMonotone = shape.smoothMonotone; var bbox = getBoundingBox(points, 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) { var k = drawSegment( ctx, points, i, len, len, 1, bbox.min, bbox.max, shape.smooth, - smoothMonotone + smoothMonotone, shape.connectNulls ); drawSegment( - ctx, stackedOnPoints, i + k - 1, len, k, + ctx, stackedOnPoints, i + k - 1, k, len, -1, stackedOnBBox.min, stackedOnBBox.max, shape.stackedOnSmooth, - smoothMonotone + smoothMonotone, shape.connectNulls ); i += k + 1; diff --git a/src/model/Series.js b/src/model/Series.js index 28a81a59fe5dd364cfcf84b875b00ee43d2f8c48..5ffbf3ce65ea05acd7c88b2f50027a5dc2472225 100644 --- a/src/model/Series.js +++ b/src/model/Series.js @@ -70,6 +70,7 @@ define(function(require) { zrUtil.merge(option, this.getDefaultOption()); // Default label emphasis `position` and `show` + // FIXME Set label in merge modelUtil.defaultEmphasis( option.label, ['position', 'show', 'textStyle', 'distance', 'formatter'] ); diff --git a/test/area.html b/test/area.html index 58e4efffd0e55aec4dacd912f1a59c60fdfdf3ee..5a250076a1b0eedffea654a08648db27e50a0fe7 100644 --- a/test/area.html +++ b/test/area.html @@ -33,6 +33,11 @@ var data2 = []; var data3 = []; + xAxisData.push('类目' + -1); + data1.push('-'); + data2.push('-'); + data3.push('-'); + for (var i = 0; i < 5; i++) { xAxisData.push('类目' + i); data1.push((-Math.random() - 0.2).toFixed(3)); @@ -51,6 +56,10 @@ data2.push((Math.random() + 0.3).toFixed(3)); data3.push((Math.random() + 0.2).toFixed(3)); } + xAxisData.push('类目' + i); + data1.push('-'); + data2.push('-'); + data3.push('-'); var itemStyle = { normal: { @@ -103,7 +112,8 @@ symbolSize: 10, data: data1, itemStyle: itemStyle, - smooth: true + smooth: true, + connectNulls: true }, { name: 'line2', type: 'line', @@ -111,6 +121,7 @@ symbolSize: 10, data: data2, itemStyle: itemStyle, + connectNulls: true, smooth: true }, { name: 'line3', @@ -124,6 +135,7 @@ show: true } }, + connectNulls: true, smooth: true }] });