ts: bug squash

src/chart/gauge/GaugeView.ts

@@ -50,10 +50,10 @@ function parsePosition(seriesModel: GaugeSeriesModel, api: ExtensionAPI): PosInf
 }
 
 function formatLabel(value: number, labelFormatter: string | ((value: number) => string)): string {
-    let label = value + '';
+    let label = value == null ? '' : (value + '');
     if (labelFormatter) {
         if (typeof labelFormatter === 'string') {
-            label = labelFormatter.replace('{value}', value != null ? value + '' : '');
+            label = labelFormatter.replace('{value}', label);
         }
         else if (typeof labelFormatter === 'function') {
             label = labelFormatter(value);

src/chart/graph/GraphView.ts

@@ -217,7 +217,7 @@ class GraphView extends ChartView {
                     api.dispatchAction({
                         type: 'focusNodeAdjacency',
                         seriesId: seriesModel.id,
-                        dataIndex: el.dataIndex
+                        dataIndex: graphic.getECData(el).dataIndex
                     });
                 });
                 el.on('mouseout', (el as any)[UNFOCUS_ADJACENCY] = function () {

src/chart/helper/LargeLineDraw.ts

@@ -55,8 +55,6 @@ type LargeLinesData = List<Model<LargeLinesCommonOption> & {
 class LargeLinesPath extends graphic.Path {
     shape: LargeLinesPathShape
 
-    seriesIndex: number
-    dataIndex: number
     __startIndex: number
 
     constructor(opts?: LargeLinesPathProps) {
@@ -262,15 +260,16 @@ class LargeLineDraw {
         lineEl.setStyle('fill');
 
         if (!isIncremental) {
+            let ecData = graphic.getECData(lineEl);
             // Enable tooltip
             // PENDING May have performance issue when path is extremely large
-            lineEl.seriesIndex = hostModel.seriesIndex;
+            ecData.seriesIndex = hostModel.seriesIndex;
             lineEl.on('mousemove', function (e) {
-                lineEl.dataIndex = null;
+                ecData.dataIndex = null;
                 var dataIndex = lineEl.findDataIndex(e.offsetX, e.offsetY);
                 if (dataIndex > 0) {
                     // Provide dataIndex for tooltip
-                    lineEl.dataIndex = dataIndex + lineEl.__startIndex;
+                    ecData.dataIndex = dataIndex + lineEl.__startIndex;
                 }
             });
         }

src/chart/helper/LargeSymbolDraw.ts

@@ -57,9 +57,6 @@ class LargeSymbolPath extends graphic.Path<LargeSymbolPathProps> {
     startIndex: number
     endIndex: number
 
-    dataIndex: number
-    seriesIndex: number
-
     constructor(opts?: LargeSymbolPathProps) {
         super(opts, null, new LargeSymbolPathShape());
     }
@@ -296,15 +293,16 @@ class LargeSymbolDraw {
         }
 
         if (!isIncremental) {
+            let ecData = graphic.getECData(symbolEl);
             // Enable tooltip
             // PENDING May have performance issue when path is extremely large
-            symbolEl.seriesIndex = (hostModel as SeriesModel).seriesIndex;
+            ecData.seriesIndex = (hostModel as SeriesModel).seriesIndex;
             symbolEl.on('mousemove', function (e) {
-                symbolEl.dataIndex = null;
+                ecData.dataIndex = null;
                 var dataIndex = symbolEl.findDataIndex(e.offsetX, e.offsetY);
                 if (dataIndex >= 0) {
                     // Provide dataIndex for tooltip
-                    symbolEl.dataIndex = dataIndex + (symbolEl.startIndex || 0);
+                    ecData.dataIndex = dataIndex + (symbolEl.startIndex || 0);
                 }
             });
         }

src/chart/helper/Line.ts

@@ -262,7 +262,7 @@ class Line extends graphic.Group {
         // values have to be set on `normalStyle`.
         if (normalText != null || emphasisText != null) {
             graphic.setTextStyle(label.style, labelModel, {
-                text: normalText + ''
+                text: normalText as string
             }, {
                 autoColor: defaultLabelColor
             });
@@ -282,7 +282,7 @@ class Line extends graphic.Group {
         if (emphasisText != null) {
             // Only these properties supported in this emphasis style here.
             label.hoverStyle = {
-                text: emphasisText + '',
+                text: emphasisText as string,
                 textFill: hoverLabelModel.getTextColor(true),
                 // For merging hover style to normal style, do not use
                 // `hoverLabelModel.getFont()` here.

src/chart/helper/Symbol.ts

@@ -42,8 +42,6 @@ type ECSymbol = ReturnType<typeof createSymbol> & {
 
 class Symbol extends graphic.Group {
 
-    dataIndex: number
-
     private _seriesModel: SeriesModel
 
     private _symbolType: string
@@ -329,7 +327,7 @@ class Symbol extends graphic.Group {
                 scale: [0, 0]
             },
             this._seriesModel,
-            this.dataIndex,
+            graphic.getECData(this).dataIndex,
             cb
         );
     }

src/chart/pie/PieView.ts

@@ -24,7 +24,7 @@ import * as graphic from '../../util/graphic';
 import ChartView from '../../view/Chart';
 import GlobalModel from '../../model/Global';
 import ExtensionAPI from '../../ExtensionAPI';
-import { Payload, DisplayState } from '../../util/types';
+import { Payload, DisplayState, ECElement } from '../../util/types';
 import List from '../../data/List';
 import PieSeriesModel, {PieDataItemOption} from './PieSeries';
 import { Dictionary } from 'zrender/src/core/types';
@@ -39,7 +39,7 @@ function updateDataSelected(
     api: ExtensionAPI
 ): void {
     var data = seriesModel.getData();
-    var dataIndex = this.dataIndex;
+    var dataIndex = graphic.getECData(this).dataIndex;
     var name = data.getName(dataIndex);
     var selectedOffset = seriesModel.get('selectedOffset');
 
@@ -96,10 +96,6 @@ interface PieceElementExtension extends Displayable {
  */
 class PiePiece extends graphic.Group {
 
-    // FIXME:TS add a type in `util/graphic.ts` for `highDownOnUpdate`.
-    highDownOnUpdate: any;
-    dataIndex: number;
-
     constructor(data: List, idx: number) {
         super();
 
@@ -197,7 +193,7 @@ class PiePiece extends graphic.Group {
         var withAnimation = !firstCreate && animationTypeUpdate === 'transition';
         this._updateLabel(data, idx, withAnimation);
 
-        this.highDownOnUpdate = (itemModel.get('hoverAnimation') && seriesModel.isAnimationEnabled())
+        (this as ECElement).highDownOnUpdate = (itemModel.get('hoverAnimation') && seriesModel.isAnimationEnabled())
             ? function (fromState: DisplayState, toState: DisplayState): void {
                 if (toState === 'emphasis') {
                     labelLine.ignore = labelLine.hoverIgnore;

src/chart/radar/RadarView.ts

@@ -228,7 +228,7 @@ class RadarView extends ChartView {
                         labelFetcher: data.hostModel,
                         labelDataIndex: idx,
                         labelDimIndex: symbolPath.__dimIdx,
-                        defaultText: defaultText + '',
+                        defaultText: defaultText as string,
                         autoColor: color,
                         isRectText: true
                     }

src/component/legend/ScrollableLegendView.ts

@@ -136,6 +136,8 @@ class ScrollableLegendView extends LegendView {
         controllerGroup.add(new graphic.Text({
             name: 'pageText',
             style: {
+                // Placeholder to calculate a proper layout.
+                text: 'xx/xx',
                 textFill: pageTextStyleModel.getTextColor(),
                 font: pageTextStyleModel.getFont(),
                 textVerticalAlign: 'middle',
@@ -386,7 +388,8 @@ class ScrollableLegendView extends LegendView {
         pageText && pageFormatter && pageText.setStyle(
             'text',
             zrUtil.isString(pageFormatter)
-                ? pageFormatter.replace('{current}', current + '').replace('{total}', total + '')
+                ? pageFormatter.replace('{current}', current == null ? '' : current + '')
+                    .replace('{total}', total == null ? '' : total + '')
                 : pageFormatter({current: current, total: total})
         );
     }

src/coord/polar/AngleAxis.ts

@@ -77,7 +77,10 @@ class AngleAxis extends Axis {
         // Not precise, just use height as text width
         // and each distance from axis line yet.
         var rect = textContain.getBoundingRect(
-            tickValue + '', labelModel.getFont(), 'center', 'top'
+            tickValue == null ? '' : tickValue + '',
+            labelModel.getFont(),
+            'center',
+            'top'
         );
         var maxH = Math.max(rect.height, 7);
 

src/preprocessor/helper/compatStyle.ts

@@ -292,7 +292,7 @@ export default function (option: any, isTheme?: boolean) {
     each(toArr(option.radar), function (radarOpt) {
         compatTextStyle(radarOpt, 'name');
         // Use axisName instead of name because component has name property
-        if (radarOpt.name && !radarOpt.axisName) {
+        if (radarOpt.name && radarOpt.axisName == null) {
             radarOpt.axisName = radarOpt.name;
             delete radarOpt.name;
             if (__DEV__) {

test/radar4.html

@@ -52,7 +52,7 @@ under the License.
                         x : 'left',
                         data:['图一','图二','图三']
                     },
-                    polar : [
+                    radar : [
                         {
                             indicator : [
                                 { text : '指标一' },