ts: add types for bar. upgrade ts version to 3.8

.vscode/settings.json

+{
+    "typescript.tsdk": "./node_modules/typescript/lib"
+}
\ No newline at end of file

package-lock.json

@@ -742,6 +742,12 @@
           "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
           "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
           "dev": true
+        },
+        "typescript": {
+          "version": "3.7.5",
+          "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.7.5.tgz",
+          "integrity": "sha512-/P5lkRXkWHNAbcJIiHPfRoKqyd7bsyCma1hZNUGfn20qm64T6ZBlrzprymeu918H+mB/0rIg2gGK/BXkhhYgBw==",
+          "dev": true
         }
       }
     },
@@ -6985,37 +6991,6 @@
         "resolve": "^1.1.6"
       }
     },
-    "rollup-plugin-progress": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmjs.org/rollup-plugin-progress/-/rollup-plugin-progress-1.1.1.tgz",
-      "integrity": "sha512-RIs2bnk/O2fylGN0F2w38U4PhAGIt8/N2noZ3i2tDOF0qg0PPZLKMMFp24MQUyND/w9nu61DRSanwpXOoJhxIA==",
-      "dev": true,
-      "requires": {
-        "chalk": "^2.4.2"
-      },
-      "dependencies": {
-        "chalk": {
-          "version": "2.4.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
-          "integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
-          "dev": true,
-          "requires": {
-            "ansi-styles": "^3.2.1",
-            "escape-string-regexp": "^1.0.5",
-            "supports-color": "^5.3.0"
-          }
-        },
-        "supports-color": {
-          "version": "5.5.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
-          "integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
-          "dev": true,
-          "requires": {
-            "has-flag": "^3.0.0"
-          }
-        }
-      }
-    },
     "rollup-plugin-typescript2": {
       "version": "0.25.3",
       "resolved": "https://registry.npmjs.org/rollup-plugin-typescript2/-/rollup-plugin-typescript2-0.25.3.tgz",
@@ -8023,9 +7998,9 @@
       }
     },
     "typescript": {
-      "version": "3.7.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.7.4.tgz",
-      "integrity": "sha512-A25xv5XCtarLwXpcDNZzCGvW2D1S3/bACratYBx2sax8PefsFhlYmkQicKHvpYflFS8if4zne5zT5kpJ7pzuvw==",
+      "version": "3.8.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.8.3.tgz",
+      "integrity": "sha512-MYlEfn5VrLNsgudQTVJeNaQFUAI7DkhnOjdpAp4T+ku1TfQClewlbSuTVHiA+8skNBgaf02TL/kLOvig4y3G8w==",
       "dev": true
     },
     "uglify-js": {

package.json

@@ -66,6 +66,6 @@
     "serve-handler": "6.1.1",
     "slugify": "1.3.4",
     "socket.io": "2.2.0",
-    "typescript": "3.7.4"
+    "typescript": "^3.8.3"
   }
 }

src/chart/bar/BarSeries.ts

@@ -17,32 +17,92 @@
 * under the License.
 */
 
-// @ts-nocheck
+import BaseBarSeriesModel, {BaseBarSeriesOption} from './BaseBarSeries';
+import SeriesModel from '../../model/Series';
+import { ItemStyleOption, OptionDataValue, LabelOption } from '../../util/types';
+import type Cartesian2D from '../../coord/cartesian/Cartesian2D';
+import type Polar from '../../coord/polar/Polar';
 
-import BaseBarSeries from './BaseBarSeries';
+type BarDataValue = OptionDataValue | OptionDataValue[]
 
-export default BaseBarSeries.extend({
+export interface BarItemStyleOption extends ItemStyleOption {
+    /**
+     * Border radius is not supported for bar on polar
+     */
+    barBorderRadius?: number | number[]
+}
+export interface BarDataItemOption {
+    name?: string
+
+    value?: BarDataValue
+
+    itemStyle?: BarItemStyleOption
+    label?: LabelOption
+
+    cursor?: string
+
+    emphasis?: {
+        itemStyle?: BarItemStyleOption
+        label?: LabelOption
+    }
+}
+
+export interface BarSeriesOption extends BaseBarSeriesOption {
+    coordinateSystem?: 'cartesian2d' | 'polar'
+
+    clip?: boolean
+
+    stack?: string
+
+    /**
+     * If use caps on two sides of bars
+     * Only available on tangential polar bar
+     */
+    roundCap?: boolean
+
+    showBackground?: boolean
 
-    type: 'series.bar',
+    backgroundStyle?: ItemStyleOption & {
+        borderRadius?: number | number[]
+    }
+
+    data?: (BarDataItemOption | BarDataValue)[]
+
+    label?: LabelOption
+
+    itemStyle?: BarItemStyleOption
+
+    emphasis?: {
+        label?: LabelOption
+        itemStyle?: BarItemStyleOption
+    }
+
+}
 
-    dependencies: ['grid', 'polar'],
+class BarSeriesModel extends BaseBarSeriesModel<BarSeriesOption> {
+    static type = 'series.bar'
+    type = BarSeriesModel.type
 
-    brushSelector: 'rect',
+    static dependencies = ['grid', 'polar']
+
+    readonly brushSelector = 'rect'
+
+    coordinateSystem: Cartesian2D | Polar
 
     /**
      * @override
      */
-    getProgressive: function () {
+    getProgressive() {
         // Do not support progressive in normal mode.
         return this.get('large')
             ? this.get('progressive')
             : false;
-    },
+    }
 
     /**
      * @override
      */
-    getProgressiveThreshold: function () {
+    getProgressiveThreshold() {
         // Do not support progressive in normal mode.
         var progressiveThreshold = this.get('progressiveThreshold');
         var largeThreshold = this.get('largeThreshold');
@@ -50,15 +110,13 @@ export default BaseBarSeries.extend({
             progressiveThreshold = largeThreshold;
         }
         return progressiveThreshold;
-    },
+    }
 
-    defaultOption: {
+    static defaultOption: BarSeriesOption = {
         // If clipped
         // Only available on cartesian2d
         clip: true,
 
-        // If use caps on two sides of bars
-        // Only available on tangential polar bar
         roundCap: false,
 
         showBackground: false,
@@ -75,4 +133,9 @@ export default BaseBarSeries.extend({
             opacity: 1
         }
     }
-});
+
+}
+
+SeriesModel.registerClass(BarSeriesModel);
+
+export default BarSeriesModel;
\ No newline at end of file

src/chart/bar/BaseBarSeries.ts

@@ -17,20 +17,76 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 import SeriesModel from '../../model/Series';
 import createListFromArray from '../helper/createListFromArray';
+import {
+    SeriesOption,
+    SeriesOnCartesianOptionMixin,
+    SeriesOnPolarOptionMixin,
+    LabelOption,
+    ItemStyleOption,
+    ScaleDataValue
+} from '../../util/types';
+import GlobalModel from '../../model/Global';
+import Cartesian2D from '../../coord/cartesian/Cartesian2D';
+
+
+export interface BaseBarSeriesOption extends SeriesOption, SeriesOnCartesianOptionMixin, SeriesOnPolarOptionMixin {
+
+    /**
+     * Min height of bar
+     */
+    barMinHeight?: number
+    /**
+     * Min angle of bar. Avaiable on polar coordinate system
+     */
+    barMinAngle?: number
+
+    /**
+     * Max width of bar. Default to be 1 on cartesian coordinate system. Otherwise it's null
+     */
+    barMaxWidth?: number
 
-export default SeriesModel.extend({
+    barMinWidth?: number
 
-    type: 'series.__base_bar__',
+    /**
+     * Bar width. Will be calculated automatically.
+     * Can be pixel width or percent string.
+     */
+    barWidth?: number | string
+
+    /**
+     * Gap between each bar inside category. Default to be 30%. Can be an aboslute pixel value
+     */
+    barGap?: string | number
+
+    /**
+     * Gap between each category. Default to be 20%. can be an absolute pixel value.
+     */
+    barCategoryGap?: string | number
+
+    large?: boolean
+    largeThreshold?: number
+
+    label?: LabelOption
+    itemStyle?: ItemStyleOption
+    emphasis?: {
+        label?: LabelOption
+        itemStyle?: ItemStyleOption
+    }
+}
 
-    getInitialData: function (option, ecModel) {
+class BaseBarSeriesModel<Opts extends BaseBarSeriesOption = BaseBarSeriesOption> extends SeriesModel<Opts> {
+
+    static type = 'series.__base_bar__'
+    type = BaseBarSeriesModel.type
+
+
+    getInitialData(option: Opts, ecModel: GlobalModel) {
         return createListFromArray(this.getSource(), this, {useEncodeDefaulter: true});
-    },
+    }
 
-    getMarkerPosition: function (value) {
+    getMarkerPosition(value: ScaleDataValue[]) {
         var coordSys = this.coordinateSystem;
         if (coordSys) {
             // PENDING if clamp ?
@@ -38,16 +94,16 @@ export default SeriesModel.extend({
             var data = this.getData();
             var offset = data.getLayout('offset');
             var size = data.getLayout('size');
-            var offsetIndex = coordSys.getBaseAxis().isHorizontal() ? 0 : 1;
+            var offsetIndex = (coordSys as Cartesian2D).getBaseAxis().isHorizontal() ? 0 : 1;
             pt[offsetIndex] += offset + size / 2;
             return pt;
         }
         return [NaN, NaN];
-    },
+    }
 
-    defaultOption: {
-        zlevel: 0,                  // 一级层叠
-        z: 2,                       // 二级层叠
+    static defaultOption: BaseBarSeriesOption = {
+        zlevel: 0,
+        z: 2,
         coordinateSystem: 'cartesian2d',
         legendHoverLink: true,
         // stack: null
@@ -56,9 +112,7 @@ export default SeriesModel.extend({
         // xAxisIndex: 0,
         // yAxisIndex: 0,
 
-        // 最小高度改为0
         barMinHeight: 0,
-        // 最小角度为0，仅对极坐标系下的柱状图有效
         barMinAngle: 0,
         // cursor: null,
 
@@ -67,21 +121,11 @@ export default SeriesModel.extend({
         progressive: 3e3,
         progressiveChunkMode: 'mod',
 
-        // barMaxWidth: null,
-
-        // In cartesian, the default value is 1. Otherwise null.
-        // barMinWidth: null,
-
-        // 默认自适应
-        // barWidth: null,
-        // 柱间距离，默认为柱形宽度的30%，可设固定值
-        // barGap: '30%',
-        // 类目间柱形距离，默认为类目间距的20%，可设固定值
-        // barCategoryGap: '20%',
-        // label: {
-        //      show: false
-        // },
         itemStyle: {},
         emphasis: {}
     }
-});
\ No newline at end of file
+}
+
+SeriesModel.registerClass(BaseBarSeriesModel);
+
+export default BaseBarSeriesModel;
\ No newline at end of file

src/chart/bar/PictorialBarSeries.ts

@@ -17,29 +17,114 @@
 * under the License.
 */
 
-// @ts-nocheck
+import BaseBarSeriesModel, { BaseBarSeriesOption } from './BaseBarSeries';
+import SeriesModel from '../../model/Series';
+import { OptionDataValue, ItemStyleOption, LabelOption, AnimationOptionMixin } from '../../util/types';
+import type Cartesian2D from '../../coord/cartesian/Cartesian2D';
 
-import BaseBarSeries from './BaseBarSeries';
+interface PictorialBarSeriesSymbolOption {
+    /**
+     * Customized bar shape
+     */
+    symbol?: string
+    /**
+     * Can be ['100%', '100%'], null means auto.
+     * The percent will be relative to category width. If no repeat.
+     * Will be relative to symbolBoundingData.
+     */
+    symbolSize?: (number | string)[] | number | string
 
-var PictorialBarSeries = BaseBarSeries.extend({
+    symbolRotate?: number
 
-    type: 'series.pictorialBar',
+    /**
+     * Default to be auto
+     */
+    symbolPosition?: 'start' | 'end' | 'center'
 
-    dependencies: ['grid'],
+    /**
+     * Can be percent offset relative to the symbolSize
+     */
+    symbolOffset?: (number | string)[] | number | string
+    /**
+     * start margin and end margin. Can be a number or a percent string relative to symbolSize.
+     * Auto margin by default.
+     */
+    symbolMargin?: (number | string)[] | number | string
+
+    /**
+     * true: means auto calculate repeat times and cut by data.
+     * a number: specifies repeat times, and do not cut by data.
+     * 'fixed': means auto calculate repeat times but do not cut by data.
+     *
+     * Otherwise means no repeat
+     */
+    symbolRepeat?: boolean | number | 'fixed'
+
+    /**
+     * From start to end or end to start.
+     */
+    symbolRepeatDirection?: 'start' | 'end'
+
+    symbolClip?: boolean
+
+    /**
+     * It will define the size of graphic elements.
+     */
+    symbolBoundingData?: number | number[]
+
+    symbolPatternSize?: number
+}
+
+type PictorialBarValue = OptionDataValue
+
+export interface PictorialBarDataItemOption extends PictorialBarSeriesSymbolOption,
+    // Pictorial bar support configure animation in each data item.
+    AnimationOptionMixin {
+    name?: string
+
+    value?: PictorialBarValue
+
+    itemStyle?: ItemStyleOption
+    label?: LabelOption
+
+    emphasis?: {
+        itemStyle?: ItemStyleOption
+        label?: LabelOption
+    }
+
+    hoverAnimation?: boolean
+
+    z?: number
+
+    cursor?: string
+}
+
+export interface PictorialBarSeriesOption extends BaseBarSeriesOption, PictorialBarSeriesSymbolOption {
+    coordinateSystem?: 'cartesian2d'
+
+    data?: (PictorialBarDataItemOption | PictorialBarValue)[]
+
+    hoverAnimation?: boolean
+}
+
+class PictorialBarSeriesModel extends BaseBarSeriesModel<PictorialBarSeriesOption> {
+    static type = 'series.pictorialBar'
+    type = PictorialBarSeriesModel.type
+
+    static dependencies = ['grid']
+
+    coordinateSystem: Cartesian2D
+
+    static defaultOption: PictorialBarSeriesOption = {
 
-    defaultOption: {
         symbol: 'circle',     // Customized bar shape
-        symbolSize: null,     // Can be ['100%', '100%'], null means auto.
+        symbolSize: null,     //
         symbolRotate: null,
 
         symbolPosition: null, // 'start' or 'end' or 'center', null means auto.
         symbolOffset: null,
-        symbolMargin: null,   // start margin and end margin. Can be a number or a percent string.
-                                // Auto margin by defualt.
-        symbolRepeat: false,  // false/null/undefined, means no repeat.
-                                // Can be true, means auto calculate repeat times and cut by data.
-                                // Can be a number, specifies repeat times, and do not cut by data.
-                                // Can be 'fixed', means auto calculate repeat times but do not cut by data.
+        symbolMargin: null,
+        symbolRepeat: false,
         symbolRepeatDirection: 'end', // 'end' means from 'start' to 'end'.
 
         symbolClip: false,
@@ -53,13 +138,15 @@ var PictorialBarSeries = BaseBarSeries.extend({
         // Disable progressive
         progressive: 0,
         hoverAnimation: false // Open only when needed.
-    },
+    }
 
-    getInitialData: function (option) {
+    getInitialData(option: PictorialBarSeriesOption) {
         // Disable stack.
-        option.stack = null;
-        return PictorialBarSeries.superApply(this, 'getInitialData', arguments);
+        (option as any).stack = null;
+        return super.getInitialData.apply(this, arguments as any);
     }
-});
+}
+
+SeriesModel.registerClass(PictorialBarSeriesModel);
 
-export default PictorialBarSeries;
\ No newline at end of file
+export default PictorialBarSeriesModel;
\ No newline at end of file

src/chart/bar/barItemStyle.ts

@@ -21,7 +21,7 @@ import makeStyleMapper from '../../model/mixin/makeStyleMapper';
 import { StyleProps } from 'zrender/src/graphic/Style';
 import Model from '../../model/Model';
 
-var getBarItemStyle = makeStyleMapper(
+var mapStyle = makeStyleMapper(
     [
         ['fill', 'color'],
         ['stroke', 'borderColor'],
@@ -48,14 +48,13 @@ type BarItemStyleKeys = 'fill'
     | 'shadowOffsetY'
     | 'shadowColor'
 type ItemStyleProps = Pick<StyleProps, BarItemStyleKeys>
-export default {
-    getBarItemStyle: function (this: Model, excludes?: BarItemStyleKeys[]): ItemStyleProps {
-        var style = getBarItemStyle(this, excludes);
-        if (this.getBorderLineDash) {
-            var lineDash = this.getBorderLineDash();
-            lineDash && (style.lineDash = lineDash);
-        }
-        return style;
+
+export function getBarItemStyle(model: Model, excludes?: BarItemStyleKeys[]): ItemStyleProps {
+    var style = mapStyle(model, excludes);
+    if (model.getBorderLineDash) {
+        var lineDash = model.getBorderLineDash();
+        lineDash && (style.lineDash = lineDash);
     }
-};
+    return style;
+}
 

src/chart/bar/helper.ts

@@ -17,16 +17,25 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 import * as graphic from '../../util/graphic';
 import {getDefaultLabel} from '../helper/labelHelper';
+import { StyleProps } from 'zrender/src/graphic/Style';
+import { LabelOption, ColorString } from '../../util/types';
+import BaseBarSeriesModel from './BaseBarSeries';
+import { BarDataItemOption } from './BarSeries';
+import Model from '../../model/Model';
 
 export function setLabel(
-    normalStyle, hoverStyle, itemModel, color, seriesModel, dataIndex, labelPositionOutside
+    normalStyle: StyleProps,
+    hoverStyle: StyleProps,
+    itemModel: Model<BarDataItemOption>,
+    color: ColorString,
+    seriesModel: BaseBarSeriesModel,
+    dataIndex: number,
+    labelPositionOutside: LabelOption['position']
 ) {
     var labelModel = itemModel.getModel('label');
-    var hoverLabelModel = itemModel.getModel('emphasis.label');
+    var hoverLabelModel = itemModel.getModel(['emphasis', 'label']);
 
     graphic.setLabelStyle(
         normalStyle, hoverStyle, labelModel, hoverLabelModel,
@@ -39,11 +48,11 @@ export function setLabel(
         }
     );
 
-    fixPosition(normalStyle);
-    fixPosition(hoverStyle);
+    fixPosition(normalStyle, labelPositionOutside);
+    fixPosition(hoverStyle, labelPositionOutside);
 }
 
-function fixPosition(style, labelPositionOutside) {
+function fixPosition(style: StyleProps, labelPositionOutside: LabelOption['position']) {
     if (style.textPosition === 'outside') {
         style.textPosition = labelPositionOutside;
     }

src/component/axisPointer/axisTrigger.ts

@@ -274,7 +274,7 @@ function buildPayloadsBySeries(value: AxisValue, axisInfo: CollectedAxisInfo) {
         else {
             dataIndices = series.getData().indicesOfNearest(
                 dataDim[0],
-                value,
+                value as number,
                 // Add a threshold to avoid find the wrong dataIndex
                 // when data length is not same.
                 // false,
@@ -290,7 +290,7 @@ function buildPayloadsBySeries(value: AxisValue, axisInfo: CollectedAxisInfo) {
             return;
         }
 
-        var diff = value - seriesNestestValue;
+        var diff = value as number - seriesNestestValue;
         var dist = Math.abs(diff);
         // Consider category case
         if (dist <= minDist) {
@@ -364,7 +364,7 @@ function showTooltip(
         axisIndex: axisModel.componentIndex,
         axisType: axisModel.type,
         axisId: axisModel.id,
-        value: value,
+        value: value as number,
         // Caustion: viewHelper.getValueLabel is actually on "view stage", which
         // depends that all models have been updated. So it should not be performed
         // here. Considering axisPointerModel used here is volatile, which is hard

src/component/helper/RoamController.ts

@@ -102,7 +102,6 @@ class RoamController extends Eventful {
         const mousewheelHandler = bind(this._mousewheelHandler, this);
         const pinchHandler = bind(this._pinchHandler, this);
 
-
         /**
          * Notice: only enable needed types. For example, if 'zoom'
          * is not needed, 'zoom' should not be enabled, otherwise

src/component/visualMap/PiecewiseView.ts

@@ -56,21 +56,7 @@ class PiecewiseVisualMapView extends VisualMapView {
             thisGroup, endsText[0], itemSize, showLabel, itemAlign
         );
 
-        zrUtil.each(viewData.viewPieceList, renderItem, this);
-
-        endsText && this._renderEndsText(
-            thisGroup, endsText[1], itemSize, showLabel, itemAlign
-        );
-
-        layout.box(
-            visualMapModel.get('orient'), thisGroup, visualMapModel.get('itemGap')
-        );
-
-        this.renderBackground(thisGroup);
-
-        this.positionGroup(thisGroup);
-
-        function renderItem(this: PiecewiseVisualMapView, item: typeof viewData.viewPieceList[number]) {
+        zrUtil.each(viewData.viewPieceList, function (item: typeof viewData.viewPieceList[number]) {
             var piece = item.piece;
 
             var itemGroup = new graphic.Group();
@@ -103,15 +89,29 @@ class PiecewiseVisualMapView extends VisualMapView {
             }
 
             thisGroup.add(itemGroup);
-        }
+        }, this);
+
+        endsText && this._renderEndsText(
+            thisGroup, endsText[1], itemSize, showLabel, itemAlign
+        );
+
+        layout.box(
+            visualMapModel.get('orient'), thisGroup, visualMapModel.get('itemGap')
+        );
+
+        this.renderBackground(thisGroup);
+
+        this.positionGroup(thisGroup);
+
+
     }
 
     private _enableHoverLink(itemGroup: graphic.Group, pieceIndex: number) {
         itemGroup
-            .on('mouseover', zrUtil.bind(onHoverLink, this, 'highlight'))
-            .on('mouseout', zrUtil.bind(onHoverLink, this, 'downplay'));
+            .on('mouseover', () => onHoverLink('highlight'))
+            .on('mouseout', () => onHoverLink('downplay'));
 
-        function onHoverLink(this: PiecewiseVisualMapView, method?: 'highlight' | 'downplay') {
+        const onHoverLink = (method?: 'highlight' | 'downplay') => {
             var visualMapModel = this.visualMapModel;
 
             // TODO: TYPE More detailed action types
@@ -122,7 +122,7 @@ class PiecewiseVisualMapView extends VisualMapView {
                     visualMapModel
                 )
             });
-        }
+        };
     }
 
     private _getItemAlign(): helper.ItemAlign {

src/coord/cartesian/Cartesian2D.ts

@@ -28,7 +28,7 @@ import GridModel from './GridModel';
 
 class Cartesian2D extends Cartesian<Axis2D> implements CoordinateSystem {
 
-    readonly type: string = 'cartesian2d';
+    readonly type = 'cartesian2d';
 
     readonly dimensions = cartesian2DDimensions;
 

src/data/List.ts

@@ -21,7 +21,6 @@
 
 /**
  * List for data storage
- * @module echarts/data/List
  */
 
 import {__DEV__} from '../config';

src/echarts.ts

@@ -161,7 +161,7 @@ function toLowercaseNameAndCallEventful<T>(host: T, method: EventMethodName, arg
 }
 
 
-class MessageCenter extends Eventful<MessageCenter> {}
+class MessageCenter extends Eventful {}
 var messageCenterProto = MessageCenter.prototype;
 messageCenterProto.on = createRegisterEventWithLowercaseMessageCenter('on');
 messageCenterProto.off = createRegisterEventWithLowercaseMessageCenter('off');
@@ -761,7 +761,7 @@ class ECharts {
 
     private _initEvents(): void {
         each(MOUSE_EVENT_NAMES, function (eveName) {
-            var handler = function (this: ECharts, e: ElementEvent) {
+            const handler = (e: ElementEvent) => {
                 var ecModel = this.getModel();
                 var targetEl = e.target;
                 var el = targetEl as ECElement;

src/layout/barGrid.ts

@@ -17,41 +17,78 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 /* global Float32Array */
 
 import * as zrUtil from 'zrender/src/core/util';
 import {parsePercent} from '../util/number';
 import {isDimensionStacked} from '../data/helper/dataStackHelper';
 import createRenderPlanner from '../chart/helper/createRenderPlanner';
+import BarSeriesModel from '../chart/bar/BarSeries';
+import Axis2D from '../coord/cartesian/Axis2D';
+import GlobalModel from '../model/Global';
+import type Cartesian2D from '../coord/cartesian/Cartesian2D';
+import { StageHandler, Dictionary } from '../util/types';
 
 var STACK_PREFIX = '__ec_stack_';
 var LARGE_BAR_MIN_WIDTH = 0.5;
 
 var LargeArr = typeof Float32Array !== 'undefined' ? Float32Array : Array;
 
-function getSeriesStackId(seriesModel) {
+
+function getSeriesStackId(seriesModel: BarSeriesModel): string {
     return seriesModel.get('stack') || STACK_PREFIX + seriesModel.seriesIndex;
 }
 
-function getAxisKey(axis) {
+function getAxisKey(axis: Axis2D): string {
     return axis.dim + axis.index;
 }
 
+interface LayoutSeriesInfo {
+    bandWidth: number
+    barWidth: number
+    barMaxWidth: number
+    barMinWidth: number
+    barGap: number | string
+    barCategoryGap: number | string
+    axisKey: string
+    stackId: string
+}
+
+interface StackInfo {
+    width: number
+    maxWidth: number
+    minWidth?: number
+}
+
+/**
+ * {
+ *  [coordSysId]: {
+ *      [stackId]: {bandWidth, offset, width}
+ *  }
+ * }
+ */
+type BarWidthAndOffset = Dictionary<Dictionary<{
+    bandWidth: number
+    offset: number
+    offsetCenter: number
+    width: number
+}>>
+
+interface LayoutOption {
+    axis: Axis2D
+    count: number
+
+    barWidth?: number
+    barMaxWidth?: number
+    barMinWidth?: number
+    barGap?: number
+    barCategoryGap?: number
+}
 /**
- * @param {Object} opt
- * @param {module:echarts/coord/Axis} opt.axis Only support category axis currently.
- * @param {number} opt.count Positive interger.
- * @param {number} [opt.barWidth]
- * @param {number} [opt.barMaxWidth]
- * @param {number} [opt.barMinWidth]
- * @param {number} [opt.barGap]
- * @param {number} [opt.barCategoryGap]
  * @return {Object} {width, offset, offsetCenter} If axis.type is not 'category', return undefined.
  */
-export function getLayoutOnAxis(opt) {
-    var params = [];
+export function getLayoutOnAxis(opt: LayoutOption) {
+    var params: LayoutSeriesInfo[] = [];
     var baseAxis = opt.axis;
     var axisKey = 'axis0';
 
@@ -65,7 +102,7 @@ export function getLayoutOnAxis(opt) {
             bandWidth: bandWidth,
             axisKey: axisKey,
             stackId: STACK_PREFIX + i
-        }, opt));
+        }, opt) as LayoutSeriesInfo);
     }
     var widthAndOffsets = doCalBarWidthAndOffset(params);
 
@@ -79,9 +116,9 @@ export function getLayoutOnAxis(opt) {
     return result;
 }
 
-export function prepareLayoutBarSeries(seriesType, ecModel) {
-    var seriesModels = [];
-    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+export function prepareLayoutBarSeries(seriesType: string, ecModel: GlobalModel): BarSeriesModel[] {
+    var seriesModels: BarSeriesModel[] = [];
+    ecModel.eachSeriesByType(seriesType, function (seriesModel: BarSeriesModel) {
         // Check series coordinate, do layout for cartesian2d only
         if (isOnCartesian(seriesModel) && !isInLargeMode(seriesModel)) {
             seriesModels.push(seriesModel);
@@ -99,7 +136,7 @@ export function prepareLayoutBarSeries(seriesType, ecModel) {
  * {'x_0': [1000000]}.
  * The value of 1000000 is in milliseconds.
  */
-function getValueAxesMinGaps(barSeries) {
+function getValueAxesMinGaps(barSeries: BarSeriesModel[]) {
     /**
      * Map from axis.index to values.
      * For a single time axis, axisValues is in the form like
@@ -107,9 +144,9 @@ function getValueAxesMinGaps(barSeries) {
      * Items in axisValues[x], e.g. 1495555200000, are time values of all
      * series.
      */
-    var axisValues = {};
+    var axisValues: Dictionary<number[]> = {};
     zrUtil.each(barSeries, function (seriesModel) {
-        var cartesian = seriesModel.coordinateSystem;
+        var cartesian = seriesModel.coordinateSystem as Cartesian2D;
         var baseAxis = cartesian.getBaseAxis();
         if (baseAxis.type !== 'time' && baseAxis.type !== 'value') {
             return;
@@ -119,7 +156,7 @@ function getValueAxesMinGaps(barSeries) {
         var key = baseAxis.dim + '_' + baseAxis.index;
         var dim = data.mapDimension(baseAxis.dim);
         for (var i = 0, cnt = data.count(); i < cnt; ++i) {
-            var value = data.get(dim, i);
+            var value = data.get(dim, i) as number;
             if (!axisValues[key]) {
                 // No previous data for the axis
                 axisValues[key] = [value];
@@ -132,7 +169,7 @@ function getValueAxesMinGaps(barSeries) {
         }
     });
 
-    var axisMinGaps = [];
+    var axisMinGaps: Dictionary<number> = {};
     for (var key in axisValues) {
         if (axisValues.hasOwnProperty(key)) {
             var valuesInAxis = axisValues[key];
@@ -158,12 +195,12 @@ function getValueAxesMinGaps(barSeries) {
     return axisMinGaps;
 }
 
-export function makeColumnLayout(barSeries) {
+export function makeColumnLayout(barSeries: BarSeriesModel[]) {
     var axisMinGaps = getValueAxesMinGaps(barSeries);
 
-    var seriesInfoList = [];
+    var seriesInfoList: LayoutSeriesInfo[] = [];
     zrUtil.each(barSeries, function (seriesModel) {
-        var cartesian = seriesModel.coordinateSystem;
+        var cartesian = seriesModel.coordinateSystem as Cartesian2D;
         var baseAxis = cartesian.getBaseAxis();
         var axisExtent = baseAxis.getExtent();
 
@@ -215,14 +252,23 @@ export function makeColumnLayout(barSeries) {
     return doCalBarWidthAndOffset(seriesInfoList);
 }
 
-function doCalBarWidthAndOffset(seriesInfoList) {
+function doCalBarWidthAndOffset(seriesInfoList: LayoutSeriesInfo[]) {
+    interface ColumnOnAxisInfo {
+        bandWidth: number
+        remainedWidth: number
+        autoWidthCount: number
+        categoryGap: number | string
+        gap: number | string
+        stacks: Dictionary<StackInfo>
+    }
+
     // Columns info on each category axis. Key is cartesian name
-    var columnsMap = {};
+    var columnsMap: Dictionary<ColumnOnAxisInfo> = {};
 
     zrUtil.each(seriesInfoList, function (seriesInfo, idx) {
         var axisKey = seriesInfo.axisKey;
         var bandWidth = seriesInfo.bandWidth;
-        var columnsOnAxis = columnsMap[axisKey] || {
+        var columnsOnAxis: ColumnOnAxisInfo = columnsMap[axisKey] || {
             bandWidth: bandWidth,
             remainedWidth: bandWidth,
             autoWidthCount: 0,
@@ -266,7 +312,7 @@ function doCalBarWidthAndOffset(seriesInfoList) {
         (barCategoryGap != null) && (columnsOnAxis.categoryGap = barCategoryGap);
     });
 
-    var result = {};
+    var result: BarWidthAndOffset = {};
 
     zrUtil.each(columnsMap, function (columnsOnAxis, coordSysName) {
 
@@ -333,7 +379,7 @@ function doCalBarWidthAndOffset(seriesInfoList) {
 
 
         var widthSum = 0;
-        var lastColumn;
+        var lastColumn: StackInfo;
         zrUtil.each(stacks, function (column, idx) {
             if (!column.width) {
                 column.width = autoWidth;
@@ -351,7 +397,7 @@ function doCalBarWidthAndOffset(seriesInfoList) {
                 bandWidth: bandWidth,
                 offset: offset,
                 width: column.width
-            };
+            } as BarWidthAndOffset[string][string];
 
             offset += column.width * (1 + barGapPercent);
         });
@@ -361,37 +407,35 @@ function doCalBarWidthAndOffset(seriesInfoList) {
 }
 
 /**
- * @param {Object} barWidthAndOffset The result of makeColumnLayout
- * @param {module:echarts/coord/Axis} axis
- * @param {module:echarts/model/Series} [seriesModel] If not provided, return all.
- * @return {Object} {stackId: {offset, width}} or {offset, width} if seriesModel provided.
+ * @param barWidthAndOffset The result of makeColumnLayout
+ * @param seriesModel If not provided, return all.
+ * @return {stackId: {offset, width}} or {offset, width} if seriesModel provided.
  */
-export function retrieveColumnLayout(barWidthAndOffset, axis, seriesModel) {
+export function retrieveColumnLayout(
+    barWidthAndOffset: BarWidthAndOffset,
+    axis: Axis2D,
+    seriesModel: BarSeriesModel
+) {
     if (barWidthAndOffset && axis) {
         var result = barWidthAndOffset[getAxisKey(axis)];
         if (result != null && seriesModel != null) {
-            result = result[getSeriesStackId(seriesModel)];
+            return result[getSeriesStackId(seriesModel)];
         }
         return result;
     }
 }
 
-/**
- * @param {string} seriesType
- * @param {module:echarts/model/Global} ecModel
- */
-export function layout(seriesType, ecModel) {
+export function layout(seriesType: string, ecModel: GlobalModel) {
 
     var seriesModels = prepareLayoutBarSeries(seriesType, ecModel);
     var barWidthAndOffset = makeColumnLayout(seriesModels);
 
-    var lastStackCoords = {};
-    var lastStackCoordsOrigin = {};
+    var lastStackCoords: Dictionary<{p: number, n: number}[]> = {};
 
     zrUtil.each(seriesModels, function (seriesModel) {
 
         var data = seriesModel.getData();
-        var cartesian = seriesModel.coordinateSystem;
+        var cartesian = seriesModel.coordinateSystem as Cartesian2D;
         var baseAxis = cartesian.getBaseAxis();
 
         var stackId = getSeriesStackId(seriesModel);
@@ -403,7 +447,6 @@ export function layout(seriesType, ecModel) {
         var barMinHeight = seriesModel.get('barMinHeight') || 0;
 
         lastStackCoords[stackId] = lastStackCoords[stackId] || [];
-        lastStackCoordsOrigin[stackId] = lastStackCoordsOrigin[stackId] || []; // Fix #4243
 
         data.setLayout({
             bandWidth: columnLayoutInfo.bandWidth,
@@ -420,9 +463,9 @@ export function layout(seriesType, ecModel) {
 
         for (var idx = 0, len = data.count(); idx < len; idx++) {
             var value = data.get(valueDim, idx);
-            var baseValue = data.get(baseDim, idx);
+            var baseValue = data.get(baseDim, idx) as number;
 
-            var sign = value >= 0 ? 'p' : 'n';
+            var sign = value >= 0 ? 'p' : 'n' as 'p' | 'n';
             var baseCoord = valueAxisStart;
 
             // Because of the barMinHeight, we can not use the value in
@@ -478,23 +521,23 @@ export function layout(seriesType, ecModel) {
             });
         }
 
-    }, this);
+    });
 }
 
 // TODO: Do not support stack in large mode yet.
-export var largeLayout = {
+export var largeLayout: StageHandler = {
 
     seriesType: 'bar',
 
     plan: createRenderPlanner(),
 
-    reset: function (seriesModel) {
+    reset: function (seriesModel: BarSeriesModel) {
         if (!isOnCartesian(seriesModel) || !isInLargeMode(seriesModel)) {
             return;
         }
 
         var data = seriesModel.getData();
-        var cartesian = seriesModel.coordinateSystem;
+        var cartesian = seriesModel.coordinateSystem as Cartesian2D;
         var coordLayout = cartesian.grid.getRect();
         var baseAxis = cartesian.getBaseAxis();
         var valueAxis = cartesian.getOtherAxis(baseAxis);
@@ -510,54 +553,56 @@ export var largeLayout = {
             barWidth = LARGE_BAR_MIN_WIDTH;
         }
 
-        return {progress: progress};
-
-        function progress(params, data) {
-            var count = params.count;
-            var largePoints = new LargeArr(count * 2);
-            var largeBackgroundPoints = new LargeArr(count * 2);
-            var largeDataIndices = new LargeArr(count);
-            var dataIndex;
-            var coord = [];
-            var valuePair = [];
-            var pointsOffset = 0;
-            var idxOffset = 0;
-
-            while ((dataIndex = params.next()) != null) {
-                valuePair[valueDimIdx] = data.get(valueDim, dataIndex);
-                valuePair[1 - valueDimIdx] = data.get(baseDim, dataIndex);
-
-                coord = cartesian.dataToPoint(valuePair, null, coord);
-                // Data index might not be in order, depends on `progressiveChunkMode`.
-                largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coordLayout.x + coordLayout.width : coord[0];
-                largePoints[pointsOffset++] = coord[0];
-                largeBackgroundPoints[pointsOffset] = valueAxisHorizontal ? coord[1] : coordLayout.y + coordLayout.height;
-                largePoints[pointsOffset++] = coord[1];
-                largeDataIndices[idxOffset++] = dataIndex;
-            }
+        return {
+            progress: function (params, data) {
+                var count = params.count;
+                var largePoints = new LargeArr(count * 2);
+                var largeBackgroundPoints = new LargeArr(count * 2);
+                var largeDataIndices = new LargeArr(count);
+                var dataIndex;
+                var coord: number[] = [];
+                var valuePair = [];
+                var pointsOffset = 0;
+                var idxOffset = 0;
+
+                while ((dataIndex = params.next()) != null) {
+                    valuePair[valueDimIdx] = data.get(valueDim, dataIndex);
+                    valuePair[1 - valueDimIdx] = data.get(baseDim, dataIndex);
+
+                    coord = cartesian.dataToPoint(valuePair, null, coord);
+                    // Data index might not be in order, depends on `progressiveChunkMode`.
+                    largeBackgroundPoints[pointsOffset] =
+                        valueAxisHorizontal ? coordLayout.x + coordLayout.width : coord[0];
+                    largePoints[pointsOffset++] = coord[0];
+                    largeBackgroundPoints[pointsOffset] =
+                        valueAxisHorizontal ? coord[1] : coordLayout.y + coordLayout.height;
+                    largePoints[pointsOffset++] = coord[1];
+                    largeDataIndices[idxOffset++] = dataIndex;
+                }
 
-            data.setLayout({
-                largePoints: largePoints,
-                largeDataIndices: largeDataIndices,
-                largeBackgroundPoints: largeBackgroundPoints,
-                barWidth: barWidth,
-                valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
-                backgroundStart: valueAxisHorizontal ? coordLayout.x : coordLayout.y,
-                valueAxisHorizontal: valueAxisHorizontal
-            });
-        }
+                data.setLayout({
+                    largePoints: largePoints,
+                    largeDataIndices: largeDataIndices,
+                    largeBackgroundPoints: largeBackgroundPoints,
+                    barWidth: barWidth,
+                    valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+                    backgroundStart: valueAxisHorizontal ? coordLayout.x : coordLayout.y,
+                    valueAxisHorizontal: valueAxisHorizontal
+                });
+            }
+        };
     }
 };
 
-function isOnCartesian(seriesModel) {
+function isOnCartesian(seriesModel: BarSeriesModel) {
     return seriesModel.coordinateSystem && seriesModel.coordinateSystem.type === 'cartesian2d';
 }
 
-function isInLargeMode(seriesModel) {
+function isInLargeMode(seriesModel: BarSeriesModel) {
     return seriesModel.pipelineContext && seriesModel.pipelineContext.large;
 }
 
 // See cases in `test/bar-start.html` and `#7412`, `#8747`.
-function getValueAxisStart(baseAxis, valueAxis, stacked) {
+function getValueAxisStart(baseAxis: Axis2D, valueAxis: Axis2D, stacked?: boolean) {
     return valueAxis.toGlobalCoord(valueAxis.dataToCoord(valueAxis.type === 'log' ? 1 : 0));
 }

src/layout/barPolar.ts

@@ -17,33 +17,53 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 import * as zrUtil from 'zrender/src/core/util';
 import {parsePercent} from '../util/number';
 import {isDimensionStacked} from '../data/helper/dataStackHelper';
+import type BarSeriesModel from '../chart/bar/BarSeries';
+import type Polar from '../coord/polar/Polar';
+import AngleAxis from '../coord/polar/AngleAxis';
+import RadiusAxis from '../coord/polar/RadiusAxis';
+import GlobalModel from '../model/Global';
+import ExtensionAPI from '../ExtensionAPI';
+import { Dictionary } from '../util/types';
+
+type PolarAxis = AngleAxis | RadiusAxis
+
+interface StackInfo {
+    width: number
+    maxWidth: number
+}
+interface LayoutColumnInfo {
+    autoWidthCount: number
+    bandWidth: number
+    remainedWidth: number
+    categoryGap: string | number
+    gap: string | number
+    stacks: Dictionary<StackInfo>
+}
+
+interface BarWidthAndOffset {
+    width: number
+    offset: number
+}
 
-function getSeriesStackId(seriesModel) {
+function getSeriesStackId(seriesModel: BarSeriesModel) {
     return seriesModel.get('stack')
         || '__ec_stack_' + seriesModel.seriesIndex;
 }
 
-function getAxisKey(polar, axis) {
+function getAxisKey(polar: Polar, axis: PolarAxis) {
     return axis.dim + polar.model.componentIndex;
 }
 
-/**
- * @param {string} seriesType
- * @param {module:echarts/model/Global} ecModel
- * @param {module:echarts/ExtensionAPI} api
- */
-function barLayoutPolar(seriesType, ecModel, api) {
+function barLayoutPolar(seriesType: string, ecModel: GlobalModel, api: ExtensionAPI) {
 
-    var lastStackCoords = {};
+    var lastStackCoords: Dictionary<{p: number, n: number}[]> = {};
 
     var barWidthAndOffset = calRadialBar(
         zrUtil.filter(
-            ecModel.getSeriesByType(seriesType),
+            ecModel.getSeriesByType(seriesType) as BarSeriesModel[],
             function (seriesModel) {
                 return !ecModel.isSeriesFiltered(seriesModel)
                     && seriesModel.coordinateSystem
@@ -52,7 +72,7 @@ function barLayoutPolar(seriesType, ecModel, api) {
         )
     );
 
-    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+    ecModel.eachSeriesByType(seriesType, function (seriesModel: BarSeriesModel) {
 
         // Check series coordinate, do layout for polar only
         if (seriesModel.coordinateSystem.type !== 'polar') {
@@ -60,7 +80,7 @@ function barLayoutPolar(seriesType, ecModel, api) {
         }
 
         var data = seriesModel.getData();
-        var polar = seriesModel.coordinateSystem;
+        var polar = seriesModel.coordinateSystem as Polar;
         var baseAxis = polar.getBaseAxis();
         var axisKey = getAxisKey(polar, baseAxis);
 
@@ -88,9 +108,9 @@ function barLayoutPolar(seriesType, ecModel, api) {
 
         for (var idx = 0, len = data.count(); idx < len; idx++) {
             var value = data.get(valueDim, idx);
-            var baseValue = data.get(baseDim, idx);
+            var baseValue = data.get(baseDim, idx) as number;
 
-            var sign = value >= 0 ? 'p' : 'n';
+            var sign = value >= 0 ? 'p' : 'n' as 'p' | 'n';
             var baseCoord = valueAxisStart;
 
             // Because of the barMinHeight, we can not use the value in
@@ -114,8 +134,8 @@ function barLayoutPolar(seriesType, ecModel, api) {
 
             // radial sector
             if (valueAxis.dim === 'radius') {
-                var radiusSpan = valueAxis.dataToRadius(value) - valueAxisStart;
-                var angle = baseAxis.dataToAngle(baseValue);
+                var radiusSpan = valueAxis.dataToCoord(value) - valueAxisStart;
+                var angle = baseAxis.dataToCoord(baseValue);
 
                 if (Math.abs(radiusSpan) < barMinHeight) {
                     radiusSpan = (radiusSpan < 0 ? -1 : 1) * barMinHeight;
@@ -130,8 +150,8 @@ function barLayoutPolar(seriesType, ecModel, api) {
             }
             // tangential sector
             else {
-                var angleSpan = valueAxis.dataToAngle(value, clampLayout) - valueAxisStart;
-                var radius = baseAxis.dataToRadius(baseValue);
+                var angleSpan = valueAxis.dataToCoord(value, clampLayout) - valueAxisStart;
+                var radius = baseAxis.dataToCoord(baseValue);
 
                 if (Math.abs(angleSpan) < barMinAngle) {
                     angleSpan = (angleSpan < 0 ? -1 : 1) * barMinAngle;
@@ -168,20 +188,20 @@ function barLayoutPolar(seriesType, ecModel, api) {
 
         }
 
-    }, this);
+    });
 
 }
 
 /**
  * Calculate bar width and offset for radial bar charts
  */
-function calRadialBar(barSeries, api) {
+function calRadialBar(barSeries: BarSeriesModel[]) {
     // Columns info on each category axis. Key is polar name
-    var columnsMap = {};
+    var columnsMap: Dictionary<LayoutColumnInfo> = {};
 
     zrUtil.each(barSeries, function (seriesModel, idx) {
         var data = seriesModel.getData();
-        var polar = seriesModel.coordinateSystem;
+        var polar = seriesModel.coordinateSystem as Polar;
 
         var baseAxis = polar.getBaseAxis();
         var axisKey = getAxisKey(polar, baseAxis);
@@ -235,7 +255,7 @@ function calRadialBar(barSeries, api) {
     });
 
 
-    var result = {};
+    var result: Dictionary<Dictionary<BarWidthAndOffset>> = {};
 
     zrUtil.each(columnsMap, function (columnsOnAxis, coordSysName) {
 
@@ -272,7 +292,7 @@ function calRadialBar(barSeries, api) {
         autoWidth = Math.max(autoWidth, 0);
 
         var widthSum = 0;
-        var lastColumn;
+        var lastColumn: StackInfo;
         zrUtil.each(stacks, function (column, idx) {
             if (!column.width) {
                 column.width = autoWidth;
@@ -289,7 +309,7 @@ function calRadialBar(barSeries, api) {
             result[coordSysName][stackId] = result[coordSysName][stackId] || {
                 offset: offset,
                 width: column.width
-            };
+            } as BarWidthAndOffset;
 
             offset += column.width * (1 + barGapPercent);
         });

src/model/Global.ts

@@ -60,7 +60,7 @@ import { Dictionary } from 'zrender/src/core/types';
 var OPTION_INNER_KEY = '\0_ec_inner';
 
 
-class GlobalModel extends Model {
+class GlobalModel extends Model<ECUnitOption> {
 
     // @readonly
     option: ECUnitOption;

src/model/Series.ts

@@ -29,7 +29,7 @@ import {
 import * as modelUtil from '../util/model';
 import {
     DataHost, DimensionName, StageHandlerProgressParams,
-    SeriesOption, TooltipRenderMode, AxisValue, ZRColor, BoxLayoutOptionMixin
+    SeriesOption, TooltipRenderMode, ZRColor, BoxLayoutOptionMixin, ScaleDataValue
 } from '../util/types';
 import ComponentModel, { ComponentModelConstructor } from './Component';
 import {ColorPaletteMixin} from './mixin/colorPalette';
@@ -327,14 +327,10 @@ class SeriesModel<Opt extends SeriesOption = SeriesOption> extends ComponentMode
         multipleSeries?: boolean,
         dataType?: string,
         renderMode?: TooltipRenderMode
-    ):
-        {
-            html: string,
-            markers: {[markName: string]: string}
-        }
-        // The override method can only return string
-        | string
-    {
+    ): {
+        html: string,
+        markers: {[markName: string]: string}
+    } | string { // The override method can only return string
 
         var series = this;
         renderMode = renderMode || 'html';
@@ -526,7 +522,7 @@ class SeriesModel<Opt extends SeriesOption = SeriesOption> extends ComponentMode
      */
     getAxisTooltipData: (
         dim: DimensionName[],
-        value: AxisValue,
+        value: ScaleDataValue,
         baseAxis: Axis
     ) => {
         dataIndices: number[],

src/util/graphic.ts

@@ -56,7 +56,8 @@ import {
     AnimationDelayCallbackParam,
     DisplayState,
     ECElement,
-    ZRRectLike
+    ZRRectLike,
+    ColorString
 } from './types';
 import GlobalModel from '../model/Global';
 
@@ -121,7 +122,7 @@ type TextCommonParams = {
      * Specify a color when color is 'auto',
      * for textFill, textStroke, textBackgroundColor, and textBorderColor. If autoColor specified, it is used as default textFill.
      */
-    autoColor?: string
+    autoColor?: ColorString
     /**
      * `true`: Use inside style (textFill, textStroke, textStrokeWidth)
      *     if `textFill` is not specified.
@@ -1067,9 +1068,9 @@ function setTokenTextStyle(
         || globalTextStyle.textShadowOffsetY;
 }
 
-function getAutoColor(color: string, opt?: {
-    autoColor?: string
-}): string {
+function getAutoColor(color: ColorString, opt?: {
+    autoColor?: ColorString
+}): ColorString {
     return color !== 'auto' ? color : (opt && opt.autoColor) ? opt.autoColor : null;
 }
 

src/util/symbol.ts

@@ -345,7 +345,7 @@ export function createSymbol(
     h: number,
     color?: string,
     keepAspect?: boolean
-): graphic.Path | graphic.Image {
+) {
     // TODO Support image object, DynamicImage.
 
     var isEmpty = symbolType.indexOf('empty') === 0;
@@ -387,5 +387,5 @@ export function createSymbol(
 
     (symbolPath as ECSymbol).setColor(color);
 
-    return symbolPath;
+    return symbolPath as ECSymbol;
 }

src/util/throttle.ts

@@ -24,7 +24,7 @@ var ORIGIN_METHOD = '\0__throttleOriginMethod';
 var RATE = '\0__throttleRate';
 var THROTTLE_TYPE = '\0__throttleType';
 
-type ThrottleFunction = () => void;
+type ThrottleFunction = (...args: any[]) => void;
 /**
  * @public
  * @param {(Function)} fn

src/util/types.ts

@@ -249,8 +249,6 @@ export type ParsedValue = ParsedValueNumeric | OrdinalRawValue;
 // will not be performed. But "scale parse" will be performed.
 export type ScaleDataValue = ParsedValue | Date;
 
-export type AxisValue = ParsedValueNumeric;
-
 // Can only be string or index, because it is used in object key in s   ome code.
 // Making the type alias here just intending to show the meaning clearly in code.
 export type DimensionIndex = number;
@@ -347,7 +345,7 @@ export type ECUnitOption = {
     media?: never
     timeline?: ComponentOption | ComponentOption[]
     [key: string]: ComponentOption | ComponentOption[] | Dictionary<any> | any
-}
+} & AnimationOptionMixin
 
 /**
  * [ECOption]:
@@ -909,8 +907,7 @@ export interface CommonAxisPointerOption {
     /**
      * current value. When using axisPointer.handle, value can be set to define the initail position of axisPointer.
      */
-    // TODO: TYPE Only support numeric value?
-    value?: ParsedValueNumeric
+    value?: ScaleDataValue
 
     status?: 'show' | 'hide'
 
@@ -998,15 +995,25 @@ export interface SeriesOption extends
 
     blendMode?: string
 
+    /**
+     * Cursor when mouse on the elements
+     */
+    cursor?: string
+
     // Needs to be override
-    data?: any;
+    data?: any
 
     legendHoverLink?: boolean
 
+    /**
+     * Configurations about progressive rendering
+     */
     progressive?: number | false
     progressiveThreshold?: number
     progressiveChunkMode?: 'mod'
-
+    /**
+     * Not available on every series
+     */
     coordinateSystem?: string
 
     // FIXME:TS more

src/view/Chart.ts

@@ -41,7 +41,58 @@ var inner = modelUtil.makeInner<{
 }>();
 var renderPlanner = createRenderPlanner();
 
+interface ChartView {
+    /**
+     * Rendering preparation in progressive mode.
+     * Implement it if needed.
+     */
+    incrementalPrepareRender(
+        seriesModel: SeriesModel,
+        ecModel: GlobalModel,
+        api: ExtensionAPI,
+        payload: Payload
+    ): void;
+
+    /**
+     * Render in progressive mode.
+     * Implement it if needed.
+     * @param params See taskParams in `stream/task.js`
+     */
+    incrementalRender(
+        params: StageHandlerProgressParams,
+        seriesModel: SeriesModel,
+        ecModel: GlobalModel,
+        api: ExtensionAPI,
+        payload: Payload
+    ): void;
+
+    /**
+     * Update transform directly.
+     * Implement it if needed.
+     */
+    updateTransform(
+        seriesModel: SeriesModel,
+        ecModel: GlobalModel,
+        api: ExtensionAPI,
+        payload: Payload
+    ): void | {update: true};
+
+    /**
+     * The view contains the given point.
+     * Implement it if needed.
+     */
+    containPoint(
+        point: number[], seriesModel: SeriesModel
+    ): boolean;
 
+    /**
+     * Pass only when return `true`.
+     * Implement it if needed.
+     */
+    filterForExposedEvent(
+        eventType: string, query: EventQueryItem, targetEl: Element, packedEvent: ECEvent
+    ): boolean;
+}
 class ChartView {
 
     // [Caution]: for compat the previous "class extend"
@@ -113,56 +164,6 @@ class ChartView {
      */
     dispose(ecModel: GlobalModel, api: ExtensionAPI): void {}
 
-    /**
-     * Rendering preparation in progressive mode.
-     * Implement it if needed.
-     */
-    incrementalPrepareRender: (
-        seriesModel: SeriesModel,
-        ecModel: GlobalModel,
-        api: ExtensionAPI,
-        payload: Payload
-    ) => void;
-
-    /**
-     * Render in progressive mode.
-     * Implement it if needed.
-     * @param params See taskParams in `stream/task.js`
-     */
-    incrementalRender: (
-        params: StageHandlerProgressParams,
-        seriesModel: SeriesModel,
-        ecModel: GlobalModel,
-        api: ExtensionAPI,
-        payload: Payload
-    ) => void;
-
-    /**
-     * Update transform directly.
-     * Implement it if needed.
-     */
-    updateTransform: (
-        seriesModel: SeriesModel,
-        ecModel: GlobalModel,
-        api: ExtensionAPI,
-        payload: Payload
-    ) => void | {update: true};
-
-    /**
-     * The view contains the given point.
-     * Implement it if needed.
-     */
-    containPoint: (
-        point: number[], seriesModel: SeriesModel
-    ) => boolean;
-
-    /**
-     * Pass only when return `true`.
-     * Implement it if needed.
-     */
-    filterForExposedEvent: (
-        eventType: string, query: EventQueryItem, targetEl: Element, packedEvent: ECEvent
-    ) => boolean;
 
     updateView(seriesModel: SeriesModel, ecModel: GlobalModel, api: ExtensionAPI, payload: Payload): void {
         this.render(seriesModel, ecModel, api, payload);

src/visual/visualSolution.ts

@@ -34,7 +34,6 @@ import List from '../data/List';
 
 var each = zrUtil.each;
 
-type WithKey<T extends string, S> = { [key in T]?: S}
 type VisualMappingCollection<VisualState extends string>
     = {
         [key in VisualState]?: {
@@ -58,7 +57,7 @@ type VisualOption = {[key in BuiltinVisualProperty]?: any};
 
 
 export function createVisualMappings<VisualState extends string>(
-    option: WithKey<VisualState, VisualOption>,
+    option: Partial<Record<VisualState, VisualOption>>,
     stateList: readonly VisualState[],
     supplementVisualOption: (mappingOption: VisualMappingOption, state: string) => void
 ) {
@@ -101,7 +100,7 @@ export function createVisualMappings<VisualState extends string>(
 }
 
 export function replaceVisualOption<T extends string>(
-    thisOption: WithKey<T, any>, newOption: WithKey<T, any>, keys: readonly T[]
+    thisOption: Partial<Record<T, any>>, newOption: Partial<Record<T, any>>, keys: readonly T[]
 ) {
     // Visual attributes merge is not supported, otherwise it
     // brings overcomplicated merge logic. See #2853. So if
@@ -140,7 +139,7 @@ export function applyVisual<VisualState extends string, Scope>(
     scope?: Scope,
     dimension?: DimensionLoose
 ) {
-    var visualTypesMap: WithKey<VisualState, BuiltinVisualProperty[]> = {};
+    var visualTypesMap: Partial<Record<VisualState, BuiltinVisualProperty[]>> = {};
     zrUtil.each(stateList, function (state) {
         var visualTypes = VisualMapping.prepareVisualTypes(visualMappings[state]);
         visualTypesMap[state] = visualTypes;
@@ -201,7 +200,7 @@ export function incrementalApplyVisual<VisualState extends string>(
     getValueState: (valueOrIndex: ParsedValue | number) => VisualState,
     dim?: DimensionLoose
 ): StageHandlerProgressExecutor {
-    var visualTypesMap: WithKey<VisualState, BuiltinVisualProperty[]> = {};
+    var visualTypesMap: Partial<Record<VisualState, BuiltinVisualProperty[]>> = {};
     zrUtil.each(stateList, function (state) {
         var visualTypes = VisualMapping.prepareVisualTypes(visualMappings[state]);
         visualTypesMap[state] = visualTypes;