You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by sh...@apache.org on 2020/03/11 11:20:13 UTC

[incubator-echarts] branch typescript updated: ts: add types for themeRiver

This is an automated email from the ASF dual-hosted git repository.

shenyi pushed a commit to branch typescript
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git


The following commit(s) were added to refs/heads/typescript by this push:
     new d202f01  ts: add types for themeRiver
d202f01 is described below

commit d202f01703e0632e9b5020921735a3ed0baf6441
Author: pissang <bm...@gmail.com>
AuthorDate: Wed Mar 11 19:19:41 2020 +0800

    ts: add types for themeRiver
---
 src/chart/bar/BarView.ts                 |   8 +-
 src/chart/themeRiver/ThemeRiverSeries.ts | 145 ++++++++++++++++++++-----------
 src/chart/themeRiver/ThemeRiverView.ts   |  69 ++++++++-------
 src/chart/themeRiver/themeRiverLayout.ts |  43 +++++----
 src/chart/themeRiver/themeRiverVisual.ts |  10 +--
 src/model/Series.ts                      |  25 +++---
 src/util/model.ts                        |   2 +-
 src/util/shape/sausage.ts                |  43 ++++-----
 src/util/types.ts                        |   2 +-
 9 files changed, 203 insertions(+), 144 deletions(-)

diff --git a/src/chart/bar/BarView.ts b/src/chart/bar/BarView.ts
index 20d8c8f..7baa1a1 100644
--- a/src/chart/bar/BarView.ts
+++ b/src/chart/bar/BarView.ts
@@ -51,6 +51,8 @@ type SectorShape = graphic.Sector['shape']
 type SectorLayout = SectorShape;
 type RectLayout = RectShape;
 
+type BarPossiblePath = graphic.Sector | graphic.Rect | Sausage
+
 function isCartesian2D(coord: CoordSysOfBar): coord is Cartesian2D {
     return coord.type === 'cartesian2d';
 }
@@ -215,7 +217,7 @@ class BarView extends ChartView {
                     );
                 }
 
-                var el = oldData.getItemGraphicEl(oldIndex) as graphic.Rect | graphic.Sector;
+                var el = oldData.getItemGraphicEl(oldIndex) as BarPossiblePath;
                 if (!data.hasValue(newIndex)) {
                     group.remove(el);
                     return;
@@ -378,7 +380,7 @@ interface ElementCreator {
     (
         dataIndex: number, layout: RectLayout | SectorLayout, isHorizontalOrRadial: boolean,
         animationModel: BarSeriesModel, isUpdate: boolean, roundCap?: boolean
-    ): graphic.Sector | graphic.Rect
+    ): BarPossiblePath
 }
 
 var elementCreator: {
@@ -519,7 +521,7 @@ function isZeroOnPolar(layout: SectorLayout) {
 }
 
 function updateStyle(
-    el: graphic.Sector | graphic.Rect,
+    el: BarPossiblePath,
     data: List, dataIndex: number,
     itemModel: Model<BarDataItemOption>,
     layout: RectLayout | SectorLayout,
diff --git a/src/chart/themeRiver/ThemeRiverSeries.ts b/src/chart/themeRiver/ThemeRiverSeries.ts
index a4561fc..1945833 100644
--- a/src/chart/themeRiver/ThemeRiverSeries.ts
+++ b/src/chart/themeRiver/ThemeRiverSeries.ts
@@ -17,8 +17,6 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 import SeriesModel from '../../model/Series';
 import createDimensions from '../../data/helper/createDimensions';
 import {getDimensionTypeByAxis} from '../../data/helper/dimensionHelper';
@@ -27,27 +25,72 @@ import * as zrUtil from 'zrender/src/core/util';
 import {groupData} from '../../util/model';
 import {encodeHTML} from '../../util/format';
 import LegendVisualProvider from '../../visual/LegendVisualProvider';
+import {
+    SeriesOption,
+    SeriesOnSingleOptionMixin,
+    LabelOption,
+    OptionDataValueDate,
+    OptionDataValueNumeric,
+    ItemStyleOption,
+    BoxLayoutOptionMixin,
+    ZRColor
+} from '../../util/types';
+import SingleAxis from '../../coord/single/SingleAxis';
+import GlobalModel from '../../model/Global';
+import Single from '../../coord/single/Single';
 
 var DATA_NAME_INDEX = 2;
 
-var ThemeRiverSeries = SeriesModel.extend({
+// export interface ThemeRiverSeriesDataItemOption {
+//     date: OptionDataValueDate
+//     value: OptionDataValueNumeric
+//     name: string
+// }
+
+interface ThemeRiverSeriesLabelOption extends LabelOption {
+    margin?: number
+}
+
+export interface ThemeRiverSeriesOption extends SeriesOption, SeriesOnSingleOptionMixin, BoxLayoutOptionMixin {
+    color?: ZRColor[]
+
+    coordinateSystem: 'singleAxis'
+
+    /**
+     * gap in axis's orthogonal orientation
+     */
+    boundaryGap: (string | number)[]
 
-    type: 'series.themeRiver',
+    label?: ThemeRiverSeriesLabelOption
+    itemStyle?: ItemStyleOption
 
-    dependencies: ['singleAxis'],
+    emphasis?: {
+        label?: ThemeRiverSeriesLabelOption
+        itemStyle?: ItemStyleOption
+    }
 
     /**
-     * @readOnly
-     * @type {module:zrender/core/util#HashMap}
+     * [date, value, name]
      */
-    nameMap: null,
+    data?: [OptionDataValueDate, OptionDataValueNumeric, string][]
+}
+
+class ThemeRiverSeriesModel extends SeriesModel<ThemeRiverSeriesOption> {
+    static readonly type = 'series.themeRiver'
+    readonly type = ThemeRiverSeriesModel.type
+
+    static readonly dependencies = ['singleAxis']
+
+    nameMap: zrUtil.HashMap<number>
+
+    coordinateSystem: Single
 
     /**
      * @override
      */
-    init: function (option) {
+    init(option: ThemeRiverSeriesOption) {
         // eslint-disable-next-line
-        ThemeRiverSeries.superApply(this, 'init', arguments);
+        super.init.apply(this, arguments as any);
 
         // Put this function here is for the sake of consistency of code style.
         // Enable legend selection for each data item
@@ -55,7 +98,7 @@ var ThemeRiverSeries = SeriesModel.extend({
         this.legendVisualProvider = new LegendVisualProvider(
             zrUtil.bind(this.getData, this), zrUtil.bind(this.getRawData, this)
         );
-    },
+    }
 
     /**
      * If there is no value of a certain point in the time for some event,set it value to 0.
@@ -63,16 +106,22 @@ var ThemeRiverSeries = SeriesModel.extend({
      * @param {Array} data  initial data in the option
      * @return {Array}
      */
-    fixData: function (data) {
+    fixData(data: ThemeRiverSeriesOption['data']) {
         var rawDataLength = data.length;
 
         // grouped data by name
         var groupResult = groupData(data, function (item) {
             return item[2];
         });
-        var layData = [];
+        var layData: {
+            name: string,
+            dataList: ThemeRiverSeriesOption['data']
+        }[] = [];
         groupResult.buckets.each(function (items, key) {
-            layData.push({name: key, dataList: items});
+            layData.push({
+                name: key,
+                dataList: items
+            });
         });
 
         var layerNum = layData.length;
@@ -103,25 +152,21 @@ var ThemeRiverSeries = SeriesModel.extend({
                     }
                 }
                 if (keyIndex === -1) {
-                    data[rawDataLength] = [];
-                    data[rawDataLength][0] = timeValue;
-                    data[rawDataLength][1] = 0;
-                    data[rawDataLength][2] = name;
+                    data[rawDataLength] = [timeValue, 0, name];
                     rawDataLength++;
 
                 }
             }
         }
         return data;
-    },
+    }
 
     /**
      * @override
-     * @param  {Object} option  the initial option that user gived
-     * @param  {module:echarts/model/Model} ecModel  the model object for themeRiver option
-     * @return {module:echarts/data/List}
+     * @param  option  the initial option that user gived
+     * @param  ecModel  the model object for themeRiver option
      */
-    getInitialData: function (option, ecModel) {
+    getInitialData(option: ThemeRiverSeriesOption, ecModel: GlobalModel): List {
 
         var singleAxisModel = ecModel.queryComponents({
             mainType: 'singleAxis',
@@ -144,8 +189,8 @@ var ThemeRiverSeries = SeriesModel.extend({
 
         for (var i = 0; i < data.length; ++i) {
             nameList.push(data[i][DATA_NAME_INDEX]);
-            if (!nameMap.get(data[i][DATA_NAME_INDEX])) {
-                nameMap.set(data[i][DATA_NAME_INDEX], count);
+            if (!nameMap.get(data[i][DATA_NAME_INDEX] as string)) {
+                nameMap.set(data[i][DATA_NAME_INDEX] as string, count);
                 count++;
             }
         }
@@ -177,15 +222,13 @@ var ThemeRiverSeries = SeriesModel.extend({
         list.initData(data);
 
         return list;
-    },
+    }
 
     /**
      * The raw data is divided into multiple layers and each layer
      *     has same name.
-     *
-     * @return {Array.<Array.<number>>}
      */
-    getLayerSeries: function () {
+    getLayerSeries() {
         var data = this.getData();
         var lenCount = data.count();
         var indexArr = [];
@@ -198,29 +241,29 @@ var ThemeRiverSeries = SeriesModel.extend({
 
         // data group by name
         var groupResult = groupData(indexArr, function (index) {
-            return data.get('name', index);
+            return data.get('name', index) as string;
         });
-        var layerSeries = [];
-        groupResult.buckets.each(function (items, key) {
-            items.sort(function (index1, index2) {
-                return data.get(timeDim, index1) - data.get(timeDim, index2);
+        var layerSeries: {
+            name: string
+            indices: number[]
+        }[] = [];
+        groupResult.buckets.each(function (items: number[], key: string) {
+            items.sort(function (index1: number, index2: number) {
+                return data.get(timeDim, index1) as number - (data.get(timeDim, index2) as number);
+            });
+            layerSeries.push({
+                name: key,
+                indices: items
             });
-            layerSeries.push({name: key, indices: items});
         });
 
         return layerSeries;
-    },
+    }
 
     /**
      * Get data indices for show tooltip content
-
-     * @param {Array.<string>|string} dim  single coordinate dimension
-     * @param {number} value axis value
-     * @param {module:echarts/coord/single/SingleAxis} baseAxis  single Axis used
-     *     the themeRiver.
-     * @return {Object} {dataIndices, nestestValue}
      */
-    getAxisTooltipData: function (dim, value, baseAxis) {
+    getAxisTooltipData(dim: string | string[], value: number, baseAxis: SingleAxis) {
         if (!zrUtil.isArray(dim)) {
             dim = dim ? [dim] : [];
         }
@@ -236,7 +279,7 @@ var ThemeRiverSeries = SeriesModel.extend({
             var nearestIdx = -1;
             var pointNum = layerSeries[i].indices.length;
             for (var j = 0; j < pointNum; ++j) {
-                var theValue = data.get(dim[0], layerSeries[i].indices[j]);
+                var theValue = data.get(dim[0], layerSeries[i].indices[j]) as number;
                 var dist = Math.abs(theValue - value);
                 if (dist <= minDist) {
                     nestestValue = theValue;
@@ -248,23 +291,23 @@ var ThemeRiverSeries = SeriesModel.extend({
         }
 
         return {dataIndices: indices, nestestValue: nestestValue};
-    },
+    }
 
     /**
      * @override
      * @param {number} dataIndex  index of data
      */
-    formatTooltip: function (dataIndex) {
+    formatTooltip(dataIndex: number): string {
         var data = this.getData();
         var htmlName = data.getName(dataIndex);
         var htmlValue = data.get(data.mapDimension('value'), dataIndex);
-        if (isNaN(htmlValue) || htmlValue == null) {
+        if (isNaN(htmlValue as number) || htmlValue == null) {
             htmlValue = '-';
         }
         return encodeHTML(htmlName + ' : ' + htmlValue);
-    },
+    }
 
-    defaultOption: {
+    static defaultOption: ThemeRiverSeriesOption = {
         zlevel: 0,
         z: 2,
 
@@ -293,6 +336,6 @@ var ThemeRiverSeries = SeriesModel.extend({
             }
         }
     }
-});
+}
 
-export default ThemeRiverSeries;
\ No newline at end of file
+export default ThemeRiverSeriesModel;
\ No newline at end of file
diff --git a/src/chart/themeRiver/ThemeRiverView.ts b/src/chart/themeRiver/ThemeRiverView.ts
index f809cc7..28c765d 100644
--- a/src/chart/themeRiver/ThemeRiverView.ts
+++ b/src/chart/themeRiver/ThemeRiverView.ts
@@ -17,28 +17,33 @@
 * under the License.
 */
 
-// @ts-nocheck
-
-import * as echarts from '../../echarts';
 import {ECPolygon} from '../line/poly';
 import * as graphic from '../../util/graphic';
 import {bind, extend} from 'zrender/src/core/util';
 import DataDiffer from '../../data/DataDiffer';
+import ChartView from '../../view/Chart';
+import ThemeRiverSeriesModel from './ThemeRiverSeries';
+import GlobalModel from '../../model/Global';
+import ExtensionAPI from '../../ExtensionAPI';
+import { RectLike } from 'zrender/src/core/BoundingRect';
+
+type LayerSeries = ReturnType<ThemeRiverSeriesModel['getLayerSeries']>
 
-export default echarts.extendChartView({
+class ThemeRiverView extends ChartView {
 
-    type: 'themeRiver',
+    static readonly type = 'themeRiver'
+    readonly type = ThemeRiverView.type
 
-    init: function () {
-        this._layers = [];
-    },
+    private _layersSeries: LayerSeries
+    private _layers: graphic.Group[] = []
 
-    render: function (seriesModel, ecModel, api) {
+    render(seriesModel: ThemeRiverSeriesModel, ecModel: GlobalModel, api: ExtensionAPI) {
         var data = seriesModel.getData();
+        var self = this;
 
         var group = this.group;
 
-        var layerSeries = seriesModel.getLayerSeries();
+        var layersSeries = seriesModel.getLayerSeries();
 
         var layoutInfo = data.getLayout('layoutInfo');
         var rect = layoutInfo.rect;
@@ -46,15 +51,15 @@ export default echarts.extendChartView({
 
         group.attr('position', [0, rect.y + boundaryGap[0]]);
 
-        function keyGetter(item) {
+        function keyGetter(item: LayerSeries[number]) {
             return item.name;
         }
         var dataDiffer = new DataDiffer(
-            this._layersSeries || [], layerSeries,
+            this._layersSeries || [], layersSeries,
             keyGetter, keyGetter
         );
 
-        var newLayersGroups = {};
+        var newLayersGroups: graphic.Group[] = [];
 
         dataDiffer
             .add(bind(process, this, 'add'))
@@ -62,8 +67,8 @@ export default echarts.extendChartView({
             .remove(bind(process, this, 'remove'))
             .execute();
 
-        function process(status, idx, oldIdx) {
-            var oldLayersGroups = this._layers;
+        function process(status: 'add' | 'update' | 'remove', idx: number, oldIdx?: number) {
+            var oldLayersGroups = self._layers;
             if (status === 'remove') {
                 group.remove(oldLayersGroups[idx]);
                 return;
@@ -71,7 +76,7 @@ export default echarts.extendChartView({
             var points0 = [];
             var points1 = [];
             var color;
-            var indices = layerSeries[idx].indices;
+            var indices = layersSeries[idx].indices;
             for (var j = 0; j < indices.length; j++) {
                 var layout = data.getItemLayout(indices[j]);
                 var x = layout.x;
@@ -84,14 +89,13 @@ export default echarts.extendChartView({
                 color = data.getItemVisual(indices[j], 'color');
             }
 
-            var polygon;
-            var text;
+            var polygon: ECPolygon;
+            var text: graphic.Text;
             var textLayout = data.getItemLayout(indices[0]);
-            var itemModel = data.getItemModel(indices[j - 1]);
-            var labelModel = itemModel.getModel('label');
+            var labelModel = seriesModel.getModel('label');
             var margin = labelModel.get('margin');
             if (status === 'add') {
-                var layerGroup = newLayersGroups[idx] = new graphic.Group();
+                const layerGroup = newLayersGroups[idx] = new graphic.Group();
                 polygon = new ECPolygon({
                     shape: {
                         points: points0,
@@ -117,9 +121,9 @@ export default echarts.extendChartView({
                 }));
             }
             else {
-                var layerGroup = oldLayersGroups[oldIdx];
-                polygon = layerGroup.childAt(0);
-                text = layerGroup.childAt(1);
+                const layerGroup = oldLayersGroups[oldIdx];
+                polygon = layerGroup.childAt(0) as ECPolygon;
+                text = layerGroup.childAt(1) as graphic.Text;
                 group.add(layerGroup);
 
                 newLayersGroups[idx] = layerGroup;
@@ -139,8 +143,8 @@ export default echarts.extendChartView({
                 }, seriesModel);
             }
 
-            var hoverItemStyleModel = itemModel.getModel('emphasis.itemStyle');
-            var itemStyleModel = itemModel.getModel('itemStyle');
+            var hoverItemStyleModel = seriesModel.getModel(['emphasis', 'itemStyle']);
+            var itemStyleModel = seriesModel.getModel('itemStyle');
 
             graphic.setTextStyle(text.style, labelModel, {
                 text: labelModel.get('show')
@@ -157,15 +161,13 @@ export default echarts.extendChartView({
             graphic.setHoverStyle(polygon, hoverItemStyleModel.getItemStyle());
         }
 
-        this._layersSeries = layerSeries;
+        this._layersSeries = layersSeries;
         this._layers = newLayersGroups;
-    },
-
-    dispose: function () {}
-});
+    }
+};
 
 // add animation to the view
-function createGridClipShape(rect, seriesModel, cb) {
+function createGridClipShape(rect: RectLike, seriesModel: ThemeRiverSeriesModel, cb: () => void) {
     var rectEl = new graphic.Rect({
         shape: {
             x: rect.x - 10,
@@ -183,3 +185,6 @@ function createGridClipShape(rect, seriesModel, cb) {
 
     return rectEl;
 }
+
+
+ChartView.registerClass(ThemeRiverView);
\ No newline at end of file
diff --git a/src/chart/themeRiver/themeRiverLayout.ts b/src/chart/themeRiver/themeRiverLayout.ts
index 82c56c3..d58ab19 100644
--- a/src/chart/themeRiver/themeRiverLayout.ts
+++ b/src/chart/themeRiver/themeRiverLayout.ts
@@ -17,20 +17,28 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 import * as zrUtil from 'zrender/src/core/util';
 import * as numberUtil from '../../util/number';
+import GlobalModel from '../../model/Global';
+import ExtensionAPI from '../../ExtensionAPI';
+import ThemeRiverSeriesModel, { ThemeRiverSeriesOption } from './ThemeRiverSeries';
+import { RectLike } from 'zrender/src/core/BoundingRect';
+import List from '../../data/List';
+
+export interface ThemeRiverLayoutInfo {
+    rect: RectLike
+    boundaryGap: ThemeRiverSeriesOption['boundaryGap']
+}
 
-export default function (ecModel, api) {
+export default function (ecModel: GlobalModel, api: ExtensionAPI) {
 
-    ecModel.eachSeriesByType('themeRiver', function (seriesModel) {
+    ecModel.eachSeriesByType('themeRiver', function (seriesModel: ThemeRiverSeriesModel) {
 
         var data = seriesModel.getData();
 
         var single = seriesModel.coordinateSystem;
 
-        var layoutInfo = {};
+        var layoutInfo = {} as ThemeRiverLayoutInfo;
 
         // use the axis boundingRect for view
         var rect = single.getRect();
@@ -63,11 +71,11 @@ export default function (ecModel, api) {
 /**
  * The layout information about themeriver
  *
- * @param {module:echarts/data/List} data  data in the series
- * @param {module:echarts/model/Series} seriesModel  the model object of themeRiver series
- * @param {number} height  value used to compute every series height
+ * @param data  data in the series
+ * @param seriesModel  the model object of themeRiver series
+ * @param height  value used to compute every series height
  */
-function themeRiverLayout(data, seriesModel, height) {
+function themeRiverLayout(data: List<ThemeRiverSeriesModel>, seriesModel: ThemeRiverSeriesModel, height: number) {
     if (!data.count()) {
         return;
     }
@@ -81,7 +89,7 @@ function themeRiverLayout(data, seriesModel, height) {
     var layerPoints = zrUtil.map(layerSeries, function (singleLayer) {
         return zrUtil.map(singleLayer.indices, function (idx) {
             var pt = coordSys.dataToPoint(data.get(timeDim, idx));
-            pt[1] = data.get(valueDim, idx);
+            pt[1] = data.get(valueDim, idx) as number;
             return pt;
         });
     });
@@ -118,17 +126,15 @@ function themeRiverLayout(data, seriesModel, height) {
  * Compute the baseLine of the rawdata
  * Inspired by Lee Byron's paper Stacked Graphs - Geometry & Aesthetics
  *
- * @param  {Array.<Array>} data  the points in each layer
- * @return {Object}
+ * @param  data  the points in each layer
  */
-function computeBaseline(data) {
+function computeBaseline(data: number[][][]) {
     var layerNum = data.length;
     var pointNum = data[0].length;
     var sums = [];
     var y0 = [];
     var max = 0;
-    var temp;
-    var base = {};
+    var temp = 0;
 
     for (var i = 0; i < pointNum; ++i) {
         for (var j = 0, temp = 0; j < layerNum; ++j) {
@@ -151,8 +157,9 @@ function computeBaseline(data) {
             max = sum;
         }
     }
-    base.y0 = y0;
-    base.max = max;
 
-    return base;
+    return {
+        y0,
+        max
+    };
 }
\ No newline at end of file
diff --git a/src/chart/themeRiver/themeRiverVisual.ts b/src/chart/themeRiver/themeRiverVisual.ts
index 5f8c026..03cdc72 100644
--- a/src/chart/themeRiver/themeRiverVisual.ts
+++ b/src/chart/themeRiver/themeRiverVisual.ts
@@ -17,16 +17,16 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 import {createHashMap} from 'zrender/src/core/util';
+import GlobalModel from '../../model/Global';
+import ThemeRiverSeriesModel from './ThemeRiverSeries';
 
-export default function (ecModel) {
-    ecModel.eachSeriesByType('themeRiver', function (seriesModel) {
+export default function (ecModel: GlobalModel) {
+    ecModel.eachSeriesByType('themeRiver', function (seriesModel: ThemeRiverSeriesModel) {
         var data = seriesModel.getData();
         var rawData = seriesModel.getRawData();
         var colorList = seriesModel.get('color');
-        var idxMap = createHashMap();
+        var idxMap = createHashMap<number>();
 
         data.each(function (idx) {
             idxMap.set(data.getRawIndex(idx), idx);
diff --git a/src/model/Series.ts b/src/model/Series.ts
index ba16bc7..7938308 100644
--- a/src/model/Series.ts
+++ b/src/model/Series.ts
@@ -73,6 +73,19 @@ interface SeriesModel {
      * @return Point of tooltip. null/undefined can be returned.
      */
     getTooltipPosition(dataIndex: number): number[];
+
+    /**
+     * Get data indices for show tooltip content. See tooltip.
+     * Implement it if needed.
+     */
+    getAxisTooltipData(
+        dim: DimensionName[],
+        value: ScaleDataValue,
+        baseAxis: Axis
+    ): {
+        dataIndices: number[],
+        nestestValue: any
+    };
 }
 
 class SeriesModel<Opt extends SeriesOption = SeriesOption> extends ComponentModel<Opt> {
@@ -532,18 +545,6 @@ class SeriesModel<Opt extends SeriesOption = SeriesOption> extends ComponentMode
         return this.get('progressiveThreshold');
     }
 
-    /**
-     * Get data indices for show tooltip content. See tooltip.
-     * Implement it if needed.
-     */
-    getAxisTooltipData: (
-        dim: DimensionName[],
-        value: ScaleDataValue,
-        baseAxis: Axis
-    ) => {
-        dataIndices: number[],
-        nestestValue: any
-    };
 
     // /**
     //  * @see {module:echarts/stream/Scheduler}
diff --git a/src/util/model.ts b/src/util/model.ts
index 25e65c9..4c53a1d 100644
--- a/src/util/model.ts
+++ b/src/util/model.ts
@@ -110,7 +110,7 @@ export var TEXT_STYLE_OPTIONS = [
     'shadowColor', 'shadowBlur', 'shadowOffsetX', 'shadowOffsetY',
     'textShadowColor', 'textShadowBlur', 'textShadowOffsetX', 'textShadowOffsetY',
     'backgroundColor', 'borderColor', 'borderWidth', 'borderRadius', 'padding'
-];
+] as const;
 
 // modelUtil.LABEL_OPTIONS = modelUtil.TEXT_STYLE_OPTIONS.concat([
 //     'position', 'offset', 'rotate', 'origin', 'show', 'distance', 'formatter',
diff --git a/src/util/shape/sausage.ts b/src/util/shape/sausage.ts
index 20bd651..11240cc 100644
--- a/src/util/shape/sausage.ts
+++ b/src/util/shape/sausage.ts
@@ -17,37 +17,36 @@
 * under the License.
 */
 
-// @ts-nocheck
-
 import {Path} from '../graphic';
+import { PathProps } from 'zrender/src/graphic/Path';
 
 /**
  * Sausage: similar to sector, but have half circle on both sides
- * @public
  */
 
-export default Path.extend({
-
-    type: 'sausage',
-
-    shape: {
-
-        cx: 0,
+class SausageShape {
+    cx = 0
+    cy = 0
+    r0 = 0
+    r = 0
+    startAngle = 0
+    endAngle = Math.PI * 2
+    clockwise = true
+}
 
-        cy: 0,
+interface SausagePathProps extends PathProps {
+    shape?: SausageShape
+}
 
-        r0: 0,
+class SausagePath extends Path {
 
-        r: 0,
+    type = 'sausage'
 
-        startAngle: 0,
-
-        endAngle: Math.PI * 2,
-
-        clockwise: true
-    },
+    constructor(opts?: SausagePathProps) {
+        super(opts, null, new SausageShape());
+    }
 
-    buildPath: function (ctx, shape) {
+    buildPath(ctx: CanvasRenderingContext2D, shape: SausageShape) {
         var x = shape.cx;
         var y = shape.cy;
         var r0 = Math.max(shape.r0 || 0, 0);
@@ -93,4 +92,6 @@ export default Path.extend({
 
         ctx.closePath();
     }
-});
+}
+
+export default SausagePath;
\ No newline at end of file
diff --git a/src/util/types.ts b/src/util/types.ts
index 75a34af..d05010d 100644
--- a/src/util/types.ts
+++ b/src/util/types.ts
@@ -415,7 +415,7 @@ export type OptionDataValue = string | number | Date;
 
 export type OptionDataValueNumeric = number | '-';
 export type OptionDataValueCategory = string;
-export type OptionDataValueDate = Date;
+export type OptionDataValueDate = Date | string | number;
 
 // export type ModelOption = Dictionary<any> | any[] | string | number | boolean | ((...args: any) => any);
 export type ModelOption = any;


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org