chore: fix some typos

src/animation/customGraphicTransition.ts

@@ -427,12 +427,12 @@ function duringCall(
         return;
     }
     // If el is remove from zr by reason like legend, during still need to called,
-    // becuase el will be added back to zr and the prop value should not be incorrect.
+    // because el will be added back to zr and the prop value should not be incorrect.
 
     const latestUserDuring = transitionInnerStore(el).userDuring;
     const scopeUserDuring = scope.userDuring;
     // Ensured a during is only called once in each animation frame.
-    // If a during is called multiple times in one frame, maybe some users' calulation logic
+    // If a during is called multiple times in one frame, maybe some users' calculation logic
     // might be wrong (not sure whether this usage exists).
     // The case of a during might be called twice can be: by default there is a animator for
     // 'x', 'y' when init. Before the init animation finished, call `setOption` to start
@@ -629,4 +629,4 @@ if (__DEV__) {
                + 'Only `' + keys(TRANSFORM_PROPS_MAP).join('`, `') + '` are permitted.');
         }
     };
-}
+}

src/component/dataZoom/roams.ts

@@ -233,7 +233,7 @@ export function installDataZoomRoamProcessor(registers: EChartsExtensionInstallR
                 || (apiInner.coordSysRecordMap = createHashMap<CoordSysRecord, string>());
 
             coordSysRecordMap.each(function (coordSysRecord) {
-                // `coordSysRecordMap` always exists (becuase it hold the `roam controller`, which should
+                // `coordSysRecordMap` always exists (because it holds the `roam controller`, which should
                 // better not re-create each time), but clear `dataZoomInfoMap` each round of the workflow.
                 coordSysRecord.dataZoomInfoMap = null;
             });
@@ -294,4 +294,4 @@ export function installDataZoomRoamProcessor(registers: EChartsExtensionInstallR
             });
     });
 
-}
+}

src/component/helper/MapDraw.ts

@@ -617,7 +617,7 @@ class MapDraw {
      * `ignore` might have been modified by `LabelManager`, and `LabelManager#addLabelsOfSeries`
      * will subsequently cache `defaultAttr` like `ignore`. If do not do this reset, the modified
      * props will have no chance to be restored.
-     * Note: this reset should be after `clearStates` in `renderSeries` becuase `useStates` in
+     * Note: This reset should be after `clearStates` in `renderSeries` because `useStates` in
      * `renderSeries` will cache the modified `ignore` to `el._normalState`.
      * TODO:
      * Use clone/immutable in `LabelManager`?
@@ -672,7 +672,7 @@ function applyOptionStyleForRegion(
         }
     >
 ): void {
-    // All of the path are using `itemStyle`, becuase
+    // All of the path are using `itemStyle`, because
     // (1) Some SVG also use fill on polyline (The different between
     // polyline and polygon is "open" or "close" but not fill or not).
     // (2) For the common props like opacity, if some use itemStyle

src/coord/View.ts

@@ -232,9 +232,9 @@ class View extends Transformable implements CoordinateSystemMaster, CoordinateSy
         const rawTransformable = this._rawTransformable;
 
         const roamTransformable = this._roamTransformable;
-        // Becuase roamTransformabel has `originX/originY` modified,
+        // Because roamTransformabel has `originX/originY` modified,
         // but the caller of `getTransformInfo` can not handle `originX/originY`,
-        // so need to recalcualte them.
+        // so need to recalculate them.
         const dummyTransformable = new Transformable();
         dummyTransformable.transform = roamTransformable.transform;
         dummyTransformable.decomposeTransform();

src/coord/axisHelper.ts

@@ -364,7 +364,7 @@ export function getOptionCategoryInterval(model: Model<AxisBaseOption['axisLabel
 
 /**
  * Set `categoryInterval` as 0 implicitly indicates that
- * show all labels reguardless of overlap.
+ * show all labels regardless of overlap.
  * @param {Object} axis axisModel.axis
  */
 export function shouldShowAllLabels(axis: Axis): boolean {

src/coord/geo/GeoSVGResource.ts

@@ -55,7 +55,7 @@ export interface GeoSVGGraphicRecord {
  */
 const REGION_AVAILABLE_SVG_TAG_MAP = createHashMap<number, SVGNodeTagLower>([
     'rect', 'circle', 'line', 'ellipse', 'polygon', 'polyline', 'path',
-    // <text> <tspan> are also enabled becuase some SVG might paint text itself,
+    // <text> <tspan> are also enabled because some SVG might paint text itself,
     // but still need to trigger events or tooltip.
     'text', 'tspan',
     // <g> is also enabled because this case: if multiple tags share one name

src/coord/geo/Region.ts

@@ -295,7 +295,7 @@ export class GeoSVGRegion extends Region {
     readonly type = 'geoSVG';
 
     // Can only be used to calculate, but not be modified.
-    // Becuase this el may not belongs to this view,
+    // Because this el may not belong to this view,
     // but been displaying on some other view.
     private _elOnlyForCalculate: Element;
 

src/core/Scheduler.ts

@@ -499,8 +499,8 @@ class Scheduler {
         // we set the pipeline block.
         let errMsg = '';
         if (__DEV__) {
-            errMsg = '"createOnAllSeries" do not supported for "overallReset", '
-                + 'becuase it will block all streams.';
+            errMsg = '"createOnAllSeries" is not supported for "overallReset", '
+                + 'because it will block all streams.';
         }
         assert(!stageHandler.createOnAllSeries, errMsg);
         if (seriesType) {

src/data/DataStore.ts

@@ -91,7 +91,7 @@ export interface DataStoreDimensionDefine {
      * For example, in `[{bb: 124, aa: 543}, ...]`, "aa" and "bb" is "object property".
      *
      * Deliberately name it as "property" rather than "name" to prevent it from been used in
-     * SOURCE_FORMAT_ARRAY_ROWS, becuase if it comes from series, it probably
+     * SOURCE_FORMAT_ARRAY_ROWS, because if it comes from series, it probably
      * can not be shared by different series.
      */
     property?: string;

src/data/helper/SeriesDataSchema.ts

@@ -157,8 +157,8 @@ export class SeriesDataSchema {
 
             // If retrieving data by index,
             //   use <index, type, ordinalMeta> to determine whether data can be shared.
-            //   (Becuase in this case there might be no dimension name defined in dataset, but indices always exists).
-            //   (indices are always 0, 1, 2, ..., so we can ignore them to shorten the hash).
+            //   (Because in this case there might be no dimension name defined in dataset, but indices always exists).
+            //   (Indices are always 0, 1, 2, ..., so we can ignore them to shorten the hash).
             // Otherwise if retrieving data by property name (like `data: [{aa: 123, bb: 765}, ...]`),
             //   use <property, type, ordinalMeta> in hash.
             if (willRetrieveDataByName

src/data/helper/transform.ts

@@ -143,7 +143,7 @@ export class ExternalSource {
     /**
      * Only support by dimension index.
      * No need to support by dimension name in transform function,
-     * becuase transform function is not case-specific, no need to use name literally.
+     * because transform function is not case-specific, no need to use name literally.
      */
     retrieveValue(dataIndex: number, dimIndex: DimensionIndex): OptionDataValue {
         return;
@@ -180,8 +180,8 @@ function createExternalSource(internalSource: Source, externalTransform: Externa
     // [MEMO]
     // Create a new dimensions structure for exposing.
     // Do not expose all dimension info to users directly.
-    // Becuase the dimension is probably auto detected from data and not might reliable.
-    // Should not lead the transformers to think that is relialbe and return it.
+    // Because the dimension is probably auto detected from data and not might reliable.
+    // Should not lead the transformers to think that is reliable and return it.
     // See [DIMENSION_INHERIT_RULE] in `sourceManager.ts`.
     const dimensions = [] as ExternalDimensionDefinition[];
     const dimsByName = {} as Dictionary<ExternalDimensionDefinition>;
@@ -505,7 +505,7 @@ function applySingleDataTransform(
             && !result.dimensions
         ) {
             const startIndex = firstUpSource.startIndex;
-            // We copy the header of upstream to the result becuase:
+            // We copy the header of upstream to the result, because:
             // (1) The returned data always does not contain header line and can not be used
             // as dimension-detection. In this case we can not use "detected dimensions" of
             // upstream directly, because it might be detected based on different `seriesLayoutBy`.

src/export/charts.ts

@@ -49,7 +49,7 @@ export {install as SunburstChart} from '../chart/sunburst/install';
 export {install as CustomChart} from '../chart/custom/install';
 
 
-// // NOTE: Don't use XXXSeriesOption from 'option.ts' becuase they have been injected markPoint, markLine etc.
+// // NOTE: Don't use XXXSeriesOption from 'option.ts' because they have been injected markPoint, markLine etc.
 // export {LineSeriesOption} from '../chart/line/LineSeries';
 // export {BarSeriesOption} from '../chart/bar/BarSeries';
 // export {ScatterSeriesOption} from '../chart/scatter/ScatterSeries';
@@ -96,4 +96,4 @@ export {
     ThemeRiverSeriesOption,
     SunburstSeriesOption,
     CustomSeriesOption
-} from './option';
+} from './option';

src/layout/barGrid.ts

@@ -363,7 +363,7 @@ function doCalBarWidthAndOffset(seriesInfoList: LayoutSeriesInfo[]) {
             }
             else {
                 // `barMinWidth/barMaxWidth` has higher priority than `barWidth`, as
-                // CSS does. Becuase barWidth can be a percent value, where
+                // CSS does. Because barWidth can be a percent value, where
                 // `barMaxWidth` can be used to restrict the final width.
                 let finalWidth = column.width;
                 if (maxWidth) {

src/model/Component.ts

@@ -50,7 +50,7 @@ const inner = makeInner<{
 
 class ComponentModel<Opt extends ComponentOption = ComponentOption> extends Model<Opt> {
 
-    // [Caution]: Becuase this class or desecendants can be used as `XXX.extend(subProto)`,
+    // [Caution]: Because this class or desecendants can be used as `XXX.extend(subProto)`,
     // the class members must not be initialized in constructor or declaration place.
     // Otherwise there is bad case:
     //   class A {xxx = 1;}

src/model/Global.ts

@@ -164,7 +164,7 @@ class GlobalModel extends Model<ECUnitOption> {
     private _componentsMap: HashMap<ComponentModel[], ComponentMainType>;
 
     /**
-     * `_componentsMap` might have "hole" becuase of remove.
+     * `_componentsMap` might have "hole" because of remove.
      * So save components count for a certain mainType here.
      */
     private _componentsCount: HashMap<number>;
@@ -275,7 +275,7 @@ class GlobalModel extends Model<ECUnitOption> {
 
         // By design, if `setOption(option2)` at the second time, and `option2` is a `ECUnitOption`,
         // it should better not have the same props with `MediaUnit['option']`.
-        // Becuase either `option2` or `MediaUnit['option']` will be always merged to "current option"
+        // Because either `option2` or `MediaUnit['option']` will be always merged to "current option"
         // rather than original "baseOption". If they both override a prop, the result might be
         // unexpected when media state changed after `setOption` called.
         // If we really need to modify a props in each `MediaUnit['option']`, use the full version
@@ -787,7 +787,7 @@ echarts.use([${seriesImportName}]);`);
 
     /**
      * After filtering, series may be different
-     * frome raw series.
+     * from raw series.
      */
     eachSeries<T>(
         cb: (this: T, series: SeriesModel, rawSeriesIndex: number) => void,
@@ -817,7 +817,7 @@ echarts.use([${seriesImportName}]);`);
 
     /**
      * After filtering, series may be different.
-     * frome raw series.
+     * from raw series.
      */
     eachSeriesByType<T>(
         subType: ComponentSubType,

src/model/Model.ts

@@ -47,7 +47,7 @@ interface Model<Opt = ModelOption>
     extends LineStyleMixin, ItemStyleMixin, TextStyleMixin, AreaStyleMixin {}
 class Model<Opt = ModelOption> {    // TODO: TYPE use unknown instead of any?
 
-    // [Caution]: Becuase this class or desecendants can be used as `XXX.extend(subProto)`,
+    // [Caution]: Because this class or desecendants can be used as `XXX.extend(subProto)`,
     // the class members must not be initialized in constructor or declaration place.
     // Otherwise there is bad case:
     //   class A {xxx = 1;}

src/model/OptionManager.ts

@@ -127,7 +127,7 @@ class OptionManager {
             // the mapping can not be 100% consistent with ecModel, which probably brings
             // potential bug!
 
-            // The first merge is delayed, becuase in most cases, users do not call `setOption` twice.
+            // The first merge is delayed, because in most cases, users do not call `setOption` twice.
             // let fakeCmptsMap = this._fakeCmptsMap;
             // if (!fakeCmptsMap) {
             //     fakeCmptsMap = this._fakeCmptsMap = createHashMap();

src/model/Series.ts

@@ -126,7 +126,7 @@ interface SeriesModel {
 
 class SeriesModel<Opt extends SeriesOption = SeriesOption> extends ComponentModel<Opt> {
 
-    // [Caution]: Becuase this class or desecendants can be used as `XXX.extend(subProto)`,
+    // [Caution]: Because this class or desecendants can be used as `XXX.extend(subProto)`,
     // the class members must not be initialized in constructor or declaration place.
     // Otherwise there is bad case:
     //   class A {xxx = 1;}

src/model/mixin/dataFormat.ts

@@ -211,8 +211,8 @@ type TooltipFormatResult =
 // compat it?
 // type TooltipFormatResultLegacyObject = {
 //     // `html` means the markup language text, either in 'html' or 'richText'.
-//     // The name `html` is not appropriate becuase in 'richText' it is not a HTML
-//     // string. But still support it for backward compat.
+//     // The name `html` is not appropriate because in 'richText' it is not a HTML
+//     // string. But still support it for backward compatibility.
 //     html: string;
 //     markers: Dictionary<ColorString>;
 // };

src/util/types.ts

@@ -411,7 +411,7 @@ export interface OrdinalScaleTick extends ScaleTick {
      * const coord = dataToCoord(ordinalScale.getRawOrdinalNumber(tick.value)).
      * ```
      * Why place the tick value here rather than the raw ordinal value (like LogScale did)?
-     * Becuase ordinal scale sort is the different case from LogScale, where
+     * Because ordinal scale sort is the different case from LogScale, where
      * axis tick, splitArea should better not to be sorted, especially in
      * anid(animation id) when `boundaryGap: true`.
      * Only axis label are sorted.

src/view/Chart.ts

@@ -97,7 +97,7 @@ interface ChartView {
 }
 class ChartView {
 
-    // [Caution]: Becuase this class or desecendants can be used as `XXX.extend(subProto)`,
+    // [Caution]: Because this class or desecendants can be used as `XXX.extend(subProto)`,
     // the class members must not be initialized in constructor or declaration place.
     // Otherwise there is bad case:
     //   class A {xxx = 1;}

src/view/Component.ts

@@ -62,7 +62,7 @@ interface ComponentView {
 
 class ComponentView {
 
-    // [Caution]: Becuase this class or desecendants can be used as `XXX.extend(subProto)`,
+    // [Caution]: Because this class or desecendants can be used as `XXX.extend(subProto)`,
     // the class members must not be initialized in constructor or declaration place.
     // Otherwise there is bad case:
     //   class A {xxx = 1;}