@visactor/vrender-components 0.17.1-alpha.4 → 0.17.2-alpha.0

package/es/legend/base.js

@@ -1,6 +1,6 @@
 import { isValid, normalizePadding } from "@visactor/vutils";
 
-import { graphicCreator } from "@visactor/vrender/es/core";
+import { createGroup } from "@visactor/vrender-core";
 
 import { AbstractComponent } from "../core/base";
 
@@ -14,7 +14,7 @@ export class LegendBase extends AbstractComponent {
     }
     render() {
         this.removeAllChild();
-        const {interactive: interactive = !0, title: title, padding: padding = 0} = this.attribute, parsedPadding = normalizePadding(padding), innerView = graphicCreator.group({
+        const {interactive: interactive = !0, title: title, padding: padding = 0} = this.attribute, parsedPadding = normalizePadding(padding), innerView = createGroup({
             x: parsedPadding[3],
             y: parsedPadding[0],
             pickable: interactive,
@@ -53,4 +53,4 @@ export class LegendBase extends AbstractComponent {
         }
     }
 }
-//# sourceMappingURL=base.js.map
+//# sourceMappingURL=base.js.map

package/es/legend/base.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/legend/base.ts"],"names":[],"mappings":"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","file":"base.js","sourcesContent":["/**\n * TODO:\n * align 为 'top' 时，操作区域同标题的间距有问题\n */\nimport { isValid, normalizePadding } from '@visactor/vutils';\nimport type { IGroup, INode } from '@visactor/vrender/es/core';\nimport { graphicCreator } from '@visactor/vrender/es/core';\nimport { AbstractComponent } from '../core/base';\nimport type { TagAttributes } from '../tag';\nimport { Tag } from '../tag';\nimport type { LegendBaseAttributes, LegendTitle } from './type';\nimport { LEGEND_ELEMENT_NAME } from './constant';\n\nexport abstract class LegendBase<T extends LegendBaseAttributes> extends AbstractComponent<Required<T>> {\n  name = 'legend';\n  protected _innerView!: IGroup;\n  protected _title: Tag | null = null;\n\n  render() {\n    this.removeAllChild();\n\n    const { interactive = true, title, padding = 0 } = this.attribute;\n    const parsedPadding = normalizePadding(padding);\n\n    // 创建一个内部的 container 用于存储所有的元素\n    const innerView = graphicCreator.group({\n      x: parsedPadding[3],\n      y: parsedPadding[0],\n      pickable: interactive,\n      childrenPickable: interactive\n    });\n    innerView.name = LEGEND_ELEMENT_NAME.innerView;\n    this.add(innerView);\n    this._innerView = innerView;\n\n    if (title?.visible) {\n      // 渲染标题\n      this._renderTitle(title);\n    }\n\n    this._renderContent();\n\n    this._adjustLayout();\n\n    if (interactive) {\n      this._bindEvents();\n    }\n\n    const viewBounds = this._innerView.AABBBounds;\n    this.attribute.width = viewBounds.width() + parsedPadding[1] + parsedPadding[3];\n    this.attribute.height = viewBounds.height() + parsedPadding[0] + parsedPadding[2];\n  }\n  /**\n   * 图例主体内容渲染\n   */\n  protected abstract _renderContent(): void;\n  /**\n   * 事件绑定逻辑\n   */\n  protected abstract _bindEvents(): void;\n\n  private _renderTitle(title: LegendTitle) {\n    const { text = '', textStyle, padding = 0, background, minWidth, maxWidth, shape } = title;\n\n    const tagAttrs: TagAttributes = {\n      x: 0,\n      y: 0,\n      text,\n      textStyle,\n      padding: normalizePadding(padding),\n      minWidth,\n      maxWidth\n    };\n\n    if (shape && shape.visible) {\n      tagAttrs.shape = {\n        visible: true,\n        ...shape.style\n      };\n      if (isValid(shape.space)) {\n        tagAttrs.space = shape.space;\n      }\n    }\n\n    if (background && background.visible) {\n      tagAttrs.panel = {\n        visible: true,\n        ...background.style\n      };\n    }\n\n    const titleTag = new Tag(tagAttrs);\n    titleTag.name = LEGEND_ELEMENT_NAME.title;\n    this._title = titleTag;\n\n    this._innerView.add(titleTag as unknown as INode);\n  }\n\n  private _adjustLayout() {\n    // 调整 title\n    if (this._title) {\n      const innerViewWidth = this._innerView.AABBBounds.width();\n      const titleWidth = this._title.AABBBounds.width();\n\n      const align = this.attribute.title?.align;\n      if (align === 'center') {\n        this._title.setAttribute('x', (innerViewWidth - titleWidth) / 2);\n      } else if (align === 'end') {\n        this._title.setAttribute('x', innerViewWidth - titleWidth);\n      }\n    }\n  }\n}\n"]}
+{"version":3,"sources":["../src/legend/base.ts"],"names":[],"mappings":"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","file":"base.js","sourcesContent":["/**\n * TODO:\n * align 为 'top' 时，操作区域同标题的间距有问题\n */\nimport { isValid, normalizePadding } from '@visactor/vutils';\nimport type { IGroup, INode } from '@visactor/vrender-core';\nimport { createGroup } from '@visactor/vrender-core';\nimport { AbstractComponent } from '../core/base';\nimport type { TagAttributes } from '../tag';\nimport { Tag } from '../tag';\nimport type { LegendBaseAttributes, LegendTitle } from './type';\nimport { LEGEND_ELEMENT_NAME } from './constant';\n\nexport abstract class LegendBase<T extends LegendBaseAttributes> extends AbstractComponent<Required<T>> {\n  name = 'legend';\n  protected _innerView!: IGroup;\n  protected _title: Tag | null = null;\n\n  render() {\n    this.removeAllChild();\n\n    const { interactive = true, title, padding = 0 } = this.attribute;\n    const parsedPadding = normalizePadding(padding);\n\n    // 创建一个内部的 container 用于存储所有的元素\n    const innerView = createGroup({\n      x: parsedPadding[3],\n      y: parsedPadding[0],\n      pickable: interactive,\n      childrenPickable: interactive\n    });\n    innerView.name = LEGEND_ELEMENT_NAME.innerView;\n    this.add(innerView);\n    this._innerView = innerView;\n\n    if (title?.visible) {\n      // 渲染标题\n      this._renderTitle(title);\n    }\n\n    this._renderContent();\n\n    this._adjustLayout();\n\n    if (interactive) {\n      this._bindEvents();\n    }\n\n    const viewBounds = this._innerView.AABBBounds;\n    this.attribute.width = viewBounds.width() + parsedPadding[1] + parsedPadding[3];\n    this.attribute.height = viewBounds.height() + parsedPadding[0] + parsedPadding[2];\n  }\n  /**\n   * 图例主体内容渲染\n   */\n  protected abstract _renderContent(): void;\n  /**\n   * 事件绑定逻辑\n   */\n  protected abstract _bindEvents(): void;\n\n  private _renderTitle(title: LegendTitle) {\n    const { text = '', textStyle, padding = 0, background, minWidth, maxWidth, shape } = title;\n\n    const tagAttrs: TagAttributes = {\n      x: 0,\n      y: 0,\n      text,\n      textStyle,\n      padding: normalizePadding(padding),\n      minWidth,\n      maxWidth\n    };\n\n    if (shape && shape.visible) {\n      tagAttrs.shape = {\n        visible: true,\n        ...shape.style\n      };\n      if (isValid(shape.space)) {\n        tagAttrs.space = shape.space;\n      }\n    }\n\n    if (background && background.visible) {\n      tagAttrs.panel = {\n        visible: true,\n        ...background.style\n      };\n    }\n\n    const titleTag = new Tag(tagAttrs);\n    titleTag.name = LEGEND_ELEMENT_NAME.title;\n    this._title = titleTag;\n\n    this._innerView.add(titleTag as unknown as INode);\n  }\n\n  private _adjustLayout() {\n    // 调整 title\n    if (this._title) {\n      const innerViewWidth = this._innerView.AABBBounds.width();\n      const titleWidth = this._title.AABBBounds.width();\n\n      const align = this.attribute.title?.align;\n      if (align === 'center') {\n        this._title.setAttribute('x', (innerViewWidth - titleWidth) / 2);\n      } else if (align === 'end') {\n        this._title.setAttribute('x', innerViewWidth - titleWidth);\n      }\n    }\n  }\n}\n"]}

package/es/legend/color/color.js

@@ -8,10 +8,6 @@ import { Slider } from "../../slider";
 
 import { DEFAULT_TITLE_SPACE } from "../constant";
 
-import { loadColorContinuousLegendComponent } from "../register";
-
-loadColorContinuousLegendComponent();
-
 export class ColorContinuousLegend extends LegendBase {
     constructor(attributes, options) {
         super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, ColorContinuousLegend.defaultAttributes, attributes)), 

package/es/legend/color/color.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/legend/color/color.ts"],"names":[],"mappings":"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","file":"color.js","sourcesContent":["/**\n * @description 连续颜色图例\n * TODO:\n * showHandlers 测试\n */\nimport { merge, isEmpty, get } from '@visactor/vutils';\nimport type { FederatedPointerEvent, IColor, ILinearGradient, INode } from '@visactor/vrender/es/core';\nimport type { ILinearScale } from '@visactor/vscale';\nimport { LinearScale } from '@visactor/vscale';\nimport { LegendBase } from '../base';\nimport { Slider } from '../../slider';\nimport { DEFAULT_TITLE_SPACE } from '../constant';\nimport type { ColorLegendAttributes } from './type';\nimport type { ComponentOptions } from '../../interface';\nimport { loadColorContinuousLegendComponent } from '../register';\n\nloadColorContinuousLegendComponent();\nexport class ColorContinuousLegend extends LegendBase<ColorLegendAttributes> {\n  name = 'colorLegend';\n\n  static defaultAttributes = {\n    layout: 'horizontal',\n    title: {\n      // orient: 'top',\n      align: 'start',\n      space: DEFAULT_TITLE_SPACE,\n      textStyle: {\n        fontSize: 12,\n        fontWeight: 'bold',\n        fill: 'rgba(46, 47, 50, 1)'\n      }\n    },\n    handlerSize: 10,\n    handlerStyle: {\n      lineWidth: 4,\n      stroke: '#fff',\n      outerBorder: {\n        distance: 2,\n        lineWidth: 1,\n        stroke: '#ccc'\n      }\n    }\n  };\n\n  private _slider!: Slider;\n  private _colorScale!: ILinearScale;\n  private _color: IColor | undefined;\n\n  constructor(attributes: ColorLegendAttributes, options?: ComponentOptions) {\n    super(options?.skipDefault ? attributes : merge({}, ColorContinuousLegend.defaultAttributes, attributes));\n  }\n\n  /**\n   * 更新数据选中范围\n   * @param value 选中数据范围\n   * @returns\n   */\n  setSelected(value: number[]) {\n    if (!this._slider) {\n      return;\n    }\n    this._slider.setValue(value);\n    this._updateColor();\n  }\n\n  protected _renderContent(): void {\n    const {\n      colors,\n      slidable,\n      layout,\n      align,\n      min,\n      max,\n      value,\n      railWidth,\n      railHeight,\n      showHandler = true,\n      handlerSize,\n      handlerStyle,\n      railStyle,\n      trackStyle,\n      startText,\n      endText,\n      handlerText,\n      showTooltip,\n      tooltip,\n      disableTriggerEvent\n    } = this.attribute as ColorLegendAttributes;\n\n    // 创建 colorScale\n    const domain = [];\n    const step = (max - min) / (colors.length - 1);\n    for (let i = 0; i < colors.length; i++) {\n      domain.push(min + step * i);\n    }\n    this._colorScale = new LinearScale().domain(domain, true).range(colors);\n    this._color = this._getTrackColor();\n\n    const slider = new Slider({\n      x: 0,\n      y: 0,\n      range: {\n        draggableTrack: true\n      },\n      slidable,\n      layout,\n      align,\n      min,\n      max,\n      value,\n      railWidth,\n      railHeight,\n      showHandler,\n      handlerSize,\n      handlerStyle,\n      railStyle,\n      trackStyle: {\n        fill: this._color,\n        ...trackStyle\n      },\n      startText,\n      endText,\n      handlerText,\n      showTooltip,\n      tooltip,\n      disableTriggerEvent\n    });\n    this._innerView.add(slider as unknown as INode);\n    this._slider = slider;\n    // 做下位置调整，对齐\n    slider.translateTo(\n      0 - slider.AABBBounds.x1,\n      (this._title ? this._title.AABBBounds.height() + get(this.attribute, 'title.space', DEFAULT_TITLE_SPACE) : 0) -\n        slider.AABBBounds.y1\n    );\n    this._updateColor();\n  }\n\n  protected _bindEvents(): void {\n    if (this.attribute.disableTriggerEvent) {\n      return;\n    }\n    if (this._slider) {\n      this._slider.addEventListener('change', this._onSliderChange as EventListenerOrEventListenerObject);\n    }\n  }\n\n  private _getTrackColor(): IColor | undefined {\n    const { colors, layout } = this.attribute as ColorLegendAttributes;\n\n    if (isEmpty(colors)) {\n      return undefined;\n    }\n    const count = colors.length;\n    if (count === 1) {\n      return colors[0];\n    }\n    const stops = [];\n\n    for (let i = 0; i < count; i++) {\n      const percent = i / (count - 1);\n      stops.push({\n        offset: percent,\n        color: colors[i]\n      });\n    }\n    const isHorizontal = layout === 'horizontal';\n    return {\n      gradient: 'linear',\n      stops,\n      x0: 0,\n      y0: 0,\n      x1: isHorizontal ? 1 : 0,\n      y1: isHorizontal ? 0 : 1\n    };\n  }\n\n  private _onSliderChange = (e: FederatedPointerEvent) => {\n    // 更新 handler 以及 track 的渐变色\n    this._updateColor();\n    this.dispatchEvent(e);\n  };\n\n  private _updateColor() {\n    const { layout = 'horizontal', colors, railWidth, railHeight } = this.attribute as ColorLegendAttributes;\n    const { startHandler, endHandler, track } = this._slider;\n    const { startValue, endValue, startPos, endPos } = this._slider.currentValue;\n\n    // 计算颜色\n    const startHandlerColor = this._colorScale.scale(startValue);\n    const endHandlerColor = this._colorScale.scale(endValue);\n    startHandler?.setAttribute('fill', startHandlerColor);\n    endHandler?.setAttribute('fill', endHandlerColor);\n\n    const isHorizontal = layout === 'horizontal';\n    const railLen = isHorizontal ? railWidth : railHeight;\n    const trackLength = Math.abs((startPos as number) - (endPos as number));\n\n    // 计算渐变色\n    if (trackLength !== railLen && colors && colors.length > 1) {\n      const stops = (this._color as ILinearGradient).stops;\n      const start = Math.min(startPos as number, endPos as number);\n      const end = Math.max(startPos as number, endPos as number);\n      const startRatio = start / railLen;\n      const endRatio = end / railLen;\n      const range = endRatio - startRatio;\n      const betweenStops = stops.filter(stop => stop.offset > startRatio && stop.offset < endRatio);\n\n      const minValue = Math.min(startValue, endValue);\n      const maxValue = Math.max(startValue, endValue);\n      const startColor = this._colorScale.scale(minValue);\n      const endColor = this._colorScale.scale(maxValue);\n      const newStops = [{ offset: 0, color: startColor }];\n      betweenStops.forEach(stop => {\n        newStops.push({\n          offset: (stop.offset - startRatio) / range,\n          color: stop.color\n        });\n      });\n      newStops.push({\n        offset: 1,\n        color: endColor\n      });\n      track.setAttribute('fill', {\n        ...(this._color as ILinearGradient),\n        stops: newStops\n      });\n    }\n  }\n}\n"]}
+{"version":3,"sources":["../src/legend/color/color.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAGvD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAIlD,MAAM,OAAO,qBAAsB,SAAQ,UAAiC;IA+B1E,YAAY,UAAiC,EAAE,OAA0B;QACvE,KAAK,CAAC,CAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,WAAW,EAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,EAAE,qBAAqB,CAAC,iBAAiB,EAAE,UAAU,CAAC,CAAC,CAAC;QA/B5G,SAAI,GAAG,aAAa,CAAC;QA+Jb,oBAAe,GAAG,CAAC,CAAwB,EAAE,EAAE;YAErD,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;QACxB,CAAC,CAAC;IAnIF,CAAC;IAOD,WAAW,CAAC,KAAe;QACzB,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE;YACjB,OAAO;SACR;QACD,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC7B,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAES,cAAc;QACtB,MAAM,EACJ,MAAM,EACN,QAAQ,EACR,MAAM,EACN,KAAK,EACL,GAAG,EACH,GAAG,EACH,KAAK,EACL,SAAS,EACT,UAAU,EACV,WAAW,GAAG,IAAI,EAClB,WAAW,EACX,YAAY,EACZ,SAAS,EACT,UAAU,EACV,SAAS,EACT,OAAO,EACP,WAAW,EACX,WAAW,EACX,OAAO,EACP,mBAAmB,EACpB,GAAG,IAAI,CAAC,SAAkC,CAAC;QAG5C,MAAM,MAAM,GAAG,EAAE,CAAC;QAClB,MAAM,IAAI,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC/C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACtC,MAAM,CAAC,IAAI,CAAC,GAAG,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC;SAC7B;QACD,IAAI,CAAC,WAAW,GAAG,IAAI,WAAW,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACxE,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAEpC,MAAM,MAAM,GAAG,IAAI,MAAM,CAAC;YACxB,CAAC,EAAE,CAAC;YACJ,CAAC,EAAE,CAAC;YACJ,KAAK,EAAE;gBACL,cAAc,EAAE,IAAI;aACrB;YACD,QAAQ;YACR,MAAM;YACN,KAAK;YACL,GAAG;YACH,GAAG;YACH,KAAK;YACL,SAAS;YACT,UAAU;YACV,WAAW;YACX,WAAW;YACX,YAAY;YACZ,SAAS;YACT,UAAU,kBACR,IAAI,EAAE,IAAI,CAAC,MAAM,IACd,UAAU,CACd;YACD,SAAS;YACT,OAAO;YACP,WAAW;YACX,WAAW;YACX,OAAO;YACP,mBAAmB;SACpB,CAAC,CAAC;QACH,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,MAA0B,CAAC,CAAC;QAChD,IAAI,CAAC,OAAO,GAAG,MAAM,CAAC;QAEtB,MAAM,CAAC,WAAW,CAChB,CAAC,GAAG,MAAM,CAAC,UAAU,CAAC,EAAE,EACxB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,MAAM,EAAE,GAAG,GAAG,CAAC,IAAI,CAAC,SAAS,EAAE,aAAa,EAAE,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YAC3G,MAAM,CAAC,UAAU,CAAC,EAAE,CACvB,CAAC;QACF,IAAI,CAAC,YAAY,EAAE,CAAC;IACtB,CAAC;IAES,WAAW;QACnB,IAAI,IAAI,CAAC,SAAS,CAAC,mBAAmB,EAAE;YACtC,OAAO;SACR;QACD,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,eAAqD,CAAC,CAAC;SACrG;IACH,CAAC;IAEO,cAAc;QACpB,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,SAAkC,CAAC;QAEnE,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE;YACnB,OAAO,SAAS,CAAC;SAClB;QACD,MAAM,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC;QAC5B,IAAI,KAAK,KAAK,CAAC,EAAE;YACf,OAAO,MAAM,CAAC,CAAC,CAAC,CAAC;SAClB;QACD,MAAM,KAAK,GAAG,EAAE,CAAC;QAEjB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,EAAE,EAAE;YAC9B,MAAM,OAAO,GAAG,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;YAChC,KAAK,CAAC,IAAI,CAAC;gBACT,MAAM,EAAE,OAAO;gBACf,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;aACjB,CAAC,CAAC;SACJ;QACD,MAAM,YAAY,GAAG,MAAM,KAAK,YAAY,CAAC;QAC7C,OAAO;YACL,QAAQ,EAAE,QAAQ;YAClB,KAAK;YACL,EAAE,EAAE,CAAC;YACL,EAAE,EAAE,CAAC;YACL,EAAE,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACxB,EAAE,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SACzB,CAAC;IACJ,CAAC;IAQO,YAAY;QAClB,MAAM,EAAE,MAAM,GAAG,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,SAAkC,CAAC;QACzG,MAAM,EAAE,YAAY,EAAE,UAAU,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC;QACzD,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC;QAG7E,MAAM,iBAAiB,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;QAC7D,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QACzD,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,YAAY,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAC;QACtD,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,YAAY,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;QAElD,MAAM,YAAY,GAAG,MAAM,KAAK,YAAY,CAAC;QAC7C,MAAM,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC;QACtD,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAE,QAAmB,GAAI,MAAiB,CAAC,CAAC;QAGxE,IAAI,WAAW,KAAK,OAAO,IAAI,MAAM,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE;YAC1D,MAAM,KAAK,GAAI,IAAI,CAAC,MAA0B,CAAC,KAAK,CAAC;YACrD,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,QAAkB,EAAE,MAAgB,CAAC,CAAC;YAC7D,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,QAAkB,EAAE,MAAgB,CAAC,CAAC;YAC3D,MAAM,UAAU,GAAG,KAAK,GAAG,OAAO,CAAC;YACnC,MAAM,QAAQ,GAAG,GAAG,GAAG,OAAO,CAAC;YAC/B,MAAM,KAAK,GAAG,QAAQ,GAAG,UAAU,CAAC;YACpC,MAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,MAAM,GAAG,UAAU,IAAI,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,CAAC;YAE9F,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;YAChD,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAC;YAChD,MAAM,UAAU,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;YACpD,MAAM,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;YAClD,MAAM,QAAQ,GAAG,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,CAAC;YACpD,YAAY,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBAC1B,QAAQ,CAAC,IAAI,CAAC;oBACZ,MAAM,EAAE,CAAC,IAAI,CAAC,MAAM,GAAG,UAAU,CAAC,GAAG,KAAK;oBAC1C,KAAK,EAAE,IAAI,CAAC,KAAK;iBAClB,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;YACH,QAAQ,CAAC,IAAI,CAAC;gBACZ,MAAM,EAAE,CAAC;gBACT,KAAK,EAAE,QAAQ;aAChB,CAAC,CAAC;YACH,KAAK,CAAC,YAAY,CAAC,MAAM,kCACnB,IAAI,CAAC,MAA0B,KACnC,KAAK,EAAE,QAAQ,IACf,CAAC;SACJ;IACH,CAAC;;AAhNM,uCAAiB,GAAG;IACzB,MAAM,EAAE,YAAY;IACpB,KAAK,EAAE;QAEL,KAAK,EAAE,OAAO;QACd,KAAK,EAAE,mBAAmB;QAC1B,SAAS,EAAE;YACT,QAAQ,EAAE,EAAE;YACZ,UAAU,EAAE,MAAM;YAClB,IAAI,EAAE,qBAAqB;SAC5B;KACF;IACD,WAAW,EAAE,EAAE;IACf,YAAY,EAAE;QACZ,SAAS,EAAE,CAAC;QACZ,MAAM,EAAE,MAAM;QACd,WAAW,EAAE;YACX,QAAQ,EAAE,CAAC;YACX,SAAS,EAAE,CAAC;YACZ,MAAM,EAAE,MAAM;SACf;KACF;CACF,CAAC","file":"color.js","sourcesContent":["/**\n * @description 连续颜色图例\n * TODO:\n * showHandlers 测试\n */\nimport { merge, isEmpty, get } from '@visactor/vutils';\nimport type { FederatedPointerEvent, IColor, ILinearGradient, INode } from '@visactor/vrender-core';\nimport type { ILinearScale } from '@visactor/vscale';\nimport { LinearScale } from '@visactor/vscale';\nimport { LegendBase } from '../base';\nimport { Slider } from '../../slider';\nimport { DEFAULT_TITLE_SPACE } from '../constant';\nimport type { ColorLegendAttributes } from './type';\nimport type { ComponentOptions } from '../../interface';\n\nexport class ColorContinuousLegend extends LegendBase<ColorLegendAttributes> {\n  name = 'colorLegend';\n\n  static defaultAttributes = {\n    layout: 'horizontal',\n    title: {\n      // orient: 'top',\n      align: 'start',\n      space: DEFAULT_TITLE_SPACE,\n      textStyle: {\n        fontSize: 12,\n        fontWeight: 'bold',\n        fill: 'rgba(46, 47, 50, 1)'\n      }\n    },\n    handlerSize: 10,\n    handlerStyle: {\n      lineWidth: 4,\n      stroke: '#fff',\n      outerBorder: {\n        distance: 2,\n        lineWidth: 1,\n        stroke: '#ccc'\n      }\n    }\n  };\n\n  private _slider!: Slider;\n  private _colorScale!: ILinearScale;\n  private _color: IColor | undefined;\n\n  constructor(attributes: ColorLegendAttributes, options?: ComponentOptions) {\n    super(options?.skipDefault ? attributes : merge({}, ColorContinuousLegend.defaultAttributes, attributes));\n  }\n\n  /**\n   * 更新数据选中范围\n   * @param value 选中数据范围\n   * @returns\n   */\n  setSelected(value: number[]) {\n    if (!this._slider) {\n      return;\n    }\n    this._slider.setValue(value);\n    this._updateColor();\n  }\n\n  protected _renderContent(): void {\n    const {\n      colors,\n      slidable,\n      layout,\n      align,\n      min,\n      max,\n      value,\n      railWidth,\n      railHeight,\n      showHandler = true,\n      handlerSize,\n      handlerStyle,\n      railStyle,\n      trackStyle,\n      startText,\n      endText,\n      handlerText,\n      showTooltip,\n      tooltip,\n      disableTriggerEvent\n    } = this.attribute as ColorLegendAttributes;\n\n    // 创建 colorScale\n    const domain = [];\n    const step = (max - min) / (colors.length - 1);\n    for (let i = 0; i < colors.length; i++) {\n      domain.push(min + step * i);\n    }\n    this._colorScale = new LinearScale().domain(domain, true).range(colors);\n    this._color = this._getTrackColor();\n\n    const slider = new Slider({\n      x: 0,\n      y: 0,\n      range: {\n        draggableTrack: true\n      },\n      slidable,\n      layout,\n      align,\n      min,\n      max,\n      value,\n      railWidth,\n      railHeight,\n      showHandler,\n      handlerSize,\n      handlerStyle,\n      railStyle,\n      trackStyle: {\n        fill: this._color,\n        ...trackStyle\n      },\n      startText,\n      endText,\n      handlerText,\n      showTooltip,\n      tooltip,\n      disableTriggerEvent\n    });\n    this._innerView.add(slider as unknown as INode);\n    this._slider = slider;\n    // 做下位置调整，对齐\n    slider.translateTo(\n      0 - slider.AABBBounds.x1,\n      (this._title ? this._title.AABBBounds.height() + get(this.attribute, 'title.space', DEFAULT_TITLE_SPACE) : 0) -\n        slider.AABBBounds.y1\n    );\n    this._updateColor();\n  }\n\n  protected _bindEvents(): void {\n    if (this.attribute.disableTriggerEvent) {\n      return;\n    }\n    if (this._slider) {\n      this._slider.addEventListener('change', this._onSliderChange as EventListenerOrEventListenerObject);\n    }\n  }\n\n  private _getTrackColor(): IColor | undefined {\n    const { colors, layout } = this.attribute as ColorLegendAttributes;\n\n    if (isEmpty(colors)) {\n      return undefined;\n    }\n    const count = colors.length;\n    if (count === 1) {\n      return colors[0];\n    }\n    const stops = [];\n\n    for (let i = 0; i < count; i++) {\n      const percent = i / (count - 1);\n      stops.push({\n        offset: percent,\n        color: colors[i]\n      });\n    }\n    const isHorizontal = layout === 'horizontal';\n    return {\n      gradient: 'linear',\n      stops,\n      x0: 0,\n      y0: 0,\n      x1: isHorizontal ? 1 : 0,\n      y1: isHorizontal ? 0 : 1\n    };\n  }\n\n  private _onSliderChange = (e: FederatedPointerEvent) => {\n    // 更新 handler 以及 track 的渐变色\n    this._updateColor();\n    this.dispatchEvent(e);\n  };\n\n  private _updateColor() {\n    const { layout = 'horizontal', colors, railWidth, railHeight } = this.attribute as ColorLegendAttributes;\n    const { startHandler, endHandler, track } = this._slider;\n    const { startValue, endValue, startPos, endPos } = this._slider.currentValue;\n\n    // 计算颜色\n    const startHandlerColor = this._colorScale.scale(startValue);\n    const endHandlerColor = this._colorScale.scale(endValue);\n    startHandler?.setAttribute('fill', startHandlerColor);\n    endHandler?.setAttribute('fill', endHandlerColor);\n\n    const isHorizontal = layout === 'horizontal';\n    const railLen = isHorizontal ? railWidth : railHeight;\n    const trackLength = Math.abs((startPos as number) - (endPos as number));\n\n    // 计算渐变色\n    if (trackLength !== railLen && colors && colors.length > 1) {\n      const stops = (this._color as ILinearGradient).stops;\n      const start = Math.min(startPos as number, endPos as number);\n      const end = Math.max(startPos as number, endPos as number);\n      const startRatio = start / railLen;\n      const endRatio = end / railLen;\n      const range = endRatio - startRatio;\n      const betweenStops = stops.filter(stop => stop.offset > startRatio && stop.offset < endRatio);\n\n      const minValue = Math.min(startValue, endValue);\n      const maxValue = Math.max(startValue, endValue);\n      const startColor = this._colorScale.scale(minValue);\n      const endColor = this._colorScale.scale(maxValue);\n      const newStops = [{ offset: 0, color: startColor }];\n      betweenStops.forEach(stop => {\n        newStops.push({\n          offset: (stop.offset - startRatio) / range,\n          color: stop.color\n        });\n      });\n      newStops.push({\n        offset: 1,\n        color: endColor\n      });\n      track.setAttribute('fill', {\n        ...(this._color as ILinearGradient),\n        stops: newStops\n      });\n    }\n  }\n}\n"]}

package/es/legend/constant.js

@@ -37,4 +37,4 @@ export var LEGEND_ELEMENT_NAME;
     LEGEND_ELEMENT_NAME.itemLabel = "legendItemLabel", LEGEND_ELEMENT_NAME.itemValue = "legendItemValue", 
     LEGEND_ELEMENT_NAME.focus = "legendItemFocus";
 }(LEGEND_ELEMENT_NAME || (LEGEND_ELEMENT_NAME = {}));
-//# sourceMappingURL=constant.js.map
+//# sourceMappingURL=constant.js.map

package/es/legend/discrete/discrete.d.ts

@@ -26,6 +26,6 @@ export declare class DiscreteLegend extends LegendBase<DiscreteLegendAttrs> {
     private _removeLegendItemState;
     private _getSelectedLegends;
     private _appendDataToShape;
-    private _dispatchEvent;
+    private _dispatchLegendEvent;
     private _handleStyle;
 }

package/es/legend/discrete/discrete.js

@@ -10,7 +10,7 @@ var __rest = this && this.__rest || function(s, e) {
 
 import { merge, isEmpty, normalizePadding, get, isValid, isNil, isFunction } from "@visactor/vutils";
 
-import { graphicCreator, CustomEvent } from "@visactor/vrender/es/core";
+import { createGroup, createText, createSymbol } from "@visactor/vrender-core";
 
 import { LegendBase } from "../base";
 
@@ -18,8 +18,6 @@ import { Pager } from "../../pager";
 
 import { DEFAULT_TITLE_SPACE, DEFAULT_ITEM_SPACE_COL, DEFAULT_ITEM_SPACE_ROW, DEFAULT_SHAPE_SPACE, DEFAULT_SHAPE_SIZE, DEFAULT_LABEL_SPACE, DEFAULT_PAGER_SPACE, LegendStateValue, DEFAULT_VALUE_SPACE, LegendEvent, LEGEND_ELEMENT_NAME } from "../constant";
 
-import { loadDiscreteLegendComponent } from "../register";
-
 const DEFAULT_STATES = {
     [LegendStateValue.focus]: {},
     [LegendStateValue.selected]: {},
@@ -28,8 +26,6 @@ const DEFAULT_STATES = {
     [LegendStateValue.unSelectedHover]: {}
 };
 
-loadDiscreteLegendComponent();
-
 export class DiscreteLegend extends LegendBase {
     constructor(attributes, options) {
         super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, DiscreteLegend.defaultAttributes, attributes)), 
@@ -68,7 +64,7 @@ export class DiscreteLegend extends LegendBase {
                     }));
                     const {selectMode: selectMode = "multiple", allowAllCanceled: allowAllCanceled = !0} = this.attribute, isSelected = legendItem.hasState(LegendStateValue.selected), currentSelectedItems = this._getSelectedLegends();
                     if ("multiple" === selectMode) {
-                        if (!1 === allowAllCanceled && isSelected && 1 === currentSelectedItems.length) return void this._dispatchEvent(LegendEvent.legendItemClick, legendItem, e);
+                        if (!1 === allowAllCanceled && isSelected && 1 === currentSelectedItems.length) return void this._dispatchLegendEvent(LegendEvent.legendItemClick, legendItem, e);
                         isSelected ? (this._removeLegendItemState(legendItem, [ LegendStateValue.selected, LegendStateValue.selectedHover ], e), 
                         this._setLegendItemState(legendItem, LegendStateValue.unSelected, e)) : (this._setLegendItemState(legendItem, LegendStateValue.selected, e), 
                         this._removeLegendItemState(legendItem, [ LegendStateValue.unSelected, LegendStateValue.unSelectedHover ], e));
@@ -78,7 +74,7 @@ export class DiscreteLegend extends LegendBase {
                         this._setLegendItemState(item, LegendStateValue.unSelected, e));
                     }));
                 }
-                this._dispatchEvent(LegendEvent.legendItemClick, legendItem, e);
+                this._dispatchLegendEvent(LegendEvent.legendItemClick, legendItem, e);
             }
         };
     }
@@ -96,7 +92,7 @@ export class DiscreteLegend extends LegendBase {
         if (!1 === item.visible || isEmpty(items)) return;
         let legendItems = items;
         reversed && (legendItems = null == items ? void 0 : items.reverse());
-        const itemsContainer = graphicCreator.group({
+        const itemsContainer = createGroup({
             x: 0,
             y: 0
         });
@@ -141,16 +137,16 @@ export class DiscreteLegend extends LegendBase {
         valueAttr = this._handleStyle(valueAttr, item, isSelected, index, items), background = this._handleStyle(background, item, isSelected, index, items);
         const parsedPadding = normalizePadding(padding);
         let itemGroup;
-        !1 === background.visible ? (itemGroup = graphicCreator.group({
+        !1 === background.visible ? (itemGroup = createGroup({
             x: 0,
             y: 0,
             cursor: (null == background ? void 0 : background.style).cursor
-        }), this._appendDataToShape(itemGroup, LEGEND_ELEMENT_NAME.item, item, itemGroup)) : (itemGroup = graphicCreator.group(Object.assign({
+        }), this._appendDataToShape(itemGroup, LEGEND_ELEMENT_NAME.item, item, itemGroup)) : (itemGroup = createGroup(Object.assign({
             x: 0,
             y: 0
         }, null == background ? void 0 : background.style)), this._appendDataToShape(itemGroup, LEGEND_ELEMENT_NAME.item, item, itemGroup, null == background ? void 0 : background.state)), 
         itemGroup.id = `${null != id ? id : label}-${index}`, itemGroup.addState(isSelected ? LegendStateValue.selected : LegendStateValue.unSelected);
-        const innerGroup = graphicCreator.group({
+        const innerGroup = createGroup({
             x: 0,
             y: 0,
             pickable: !1
@@ -159,7 +155,7 @@ export class DiscreteLegend extends LegendBase {
         let focusShape, focusStartX = 0, shapeSize = 0, shapeSpace = 0;
         if (!1 !== (null == shapeAttr ? void 0 : shapeAttr.visible)) {
             shapeSize = get(shapeAttr, "style.size", DEFAULT_SHAPE_SIZE), shapeSpace = get(shapeAttr, "space", DEFAULT_SHAPE_SPACE);
-            const itemShape = graphicCreator.symbol(Object.assign(Object.assign({
+            const itemShape = createSymbol(Object.assign(Object.assign({
                 x: 0,
                 y: 0,
                 symbolType: "circle",
@@ -176,7 +172,7 @@ export class DiscreteLegend extends LegendBase {
         let focusSpace = 0;
         if (focus) {
             const focusSize = get(focusIconStyle, "size", DEFAULT_SHAPE_SIZE);
-            focusShape = graphicCreator.symbol(Object.assign(Object.assign({
+            focusShape = createSymbol(Object.assign(Object.assign({
                 x: 0,
                 y: -focusSize / 2 - 1,
                 strokeBoundsBuffer: 0
@@ -187,7 +183,7 @@ export class DiscreteLegend extends LegendBase {
             })), this._appendDataToShape(focusShape, LEGEND_ELEMENT_NAME.focus, item, itemGroup), 
             focusSpace = focusSize;
         }
-        const labelShape = graphicCreator.text(Object.assign(Object.assign({
+        const labelShape = createText(Object.assign(Object.assign({
             x: shapeSize / 2 + shapeSpace,
             y: 0,
             textAlign: "start",
@@ -201,7 +197,7 @@ export class DiscreteLegend extends LegendBase {
         innerGroup.add(labelShape);
         const labelSpace = get(labelAttr, "space", DEFAULT_LABEL_SPACE);
         if (isValid(value)) {
-            const valueSpace = get(valueAttr, "space", focus ? DEFAULT_VALUE_SPACE : 0), valueShape = graphicCreator.text(Object.assign(Object.assign({
+            const valueSpace = get(valueAttr, "space", focus ? DEFAULT_VALUE_SPACE : 0), valueShape = createText(Object.assign(Object.assign({
                 x: 0,
                 y: 0,
                 textAlign: "start",
@@ -283,7 +279,7 @@ export class DiscreteLegend extends LegendBase {
             });
         }
         pager.defaultCurrent > 1 && (isHorizontal ? itemsContainer.setAttribute("y", -(pager.defaultCurrent - 1) * (pageHeight + spaceRow)) : itemsContainer.setAttribute("x", -(pager.defaultCurrent - 1) * (pageWidth + spaceCol)));
-        const clipGroup = graphicCreator.group({
+        const clipGroup = createGroup({
             x: 0,
             y: renderStartY,
             width: pageWidth,
@@ -307,7 +303,7 @@ export class DiscreteLegend extends LegendBase {
         this._lastActiveItem = legendItem;
         legendItem.hasState(LegendStateValue.selected) ? this._setLegendItemState(legendItem, LegendStateValue.selectedHover, e) : this._setLegendItemState(legendItem, LegendStateValue.unSelectedHover, e);
         const focusButton = legendItem.getChildren()[0].find((node => node.name === LEGEND_ELEMENT_NAME.focus), !1);
-        focusButton && focusButton.setAttribute("visible", !0), this._dispatchEvent(LegendEvent.legendItemHover, legendItem, e);
+        focusButton && focusButton.setAttribute("visible", !0), this._dispatchLegendEvent(LegendEvent.legendItemHover, legendItem, e);
     }
     _unHover(legendItem, e) {
         let attributeUpdate = !1;
@@ -318,8 +314,8 @@ export class DiscreteLegend extends LegendBase {
             child.removeState(LegendStateValue.unSelectedHover), child.removeState(LegendStateValue.selectedHover);
         }));
         const focusButton = legendItem.getChildren()[0].find((node => node.name === LEGEND_ELEMENT_NAME.focus), !1);
-        focusButton && focusButton.setAttribute("visible", !1), attributeUpdate && this._dispatchEvent(LegendEvent.legendItemAttributeUpdate, legendItem, e), 
-        this._dispatchEvent(LegendEvent.legendItemUnHover, legendItem, e);
+        focusButton && focusButton.setAttribute("visible", !1), attributeUpdate && this._dispatchLegendEvent(LegendEvent.legendItemAttributeUpdate, legendItem, e), 
+        this._dispatchLegendEvent(LegendEvent.legendItemUnHover, legendItem, e);
     }
     _setLegendItemState(legendItem, stateName, e) {
         let attributeUpdate = !1;
@@ -327,7 +323,7 @@ export class DiscreteLegend extends LegendBase {
         legendItem.getChildren()[0].getChildren().forEach((child => {
             child.name !== LEGEND_ELEMENT_NAME.focus && (attributeUpdate || child.hasState(stateName) || (attributeUpdate = !0), 
             child.addState(stateName, true));
-        })), attributeUpdate && this._dispatchEvent(LegendEvent.legendItemAttributeUpdate, legendItem, e);
+        })), attributeUpdate && this._dispatchLegendEvent(LegendEvent.legendItemAttributeUpdate, legendItem, e);
     }
     _removeLegendItemState(legendItem, stateNames, e) {
         let attributeUpdate = !1;
@@ -337,7 +333,7 @@ export class DiscreteLegend extends LegendBase {
             child.name !== LEGEND_ELEMENT_NAME.focus && stateNames.forEach((name => {
                 !attributeUpdate && child.hasState(name) && (attributeUpdate = !0), child.removeState(name);
             }));
-        })), attributeUpdate && this._dispatchEvent(LegendEvent.legendItemAttributeUpdate, legendItem, e);
+        })), attributeUpdate && this._dispatchLegendEvent(LegendEvent.legendItemAttributeUpdate, legendItem, e);
     }
     _getSelectedLegends() {
         var _a;
@@ -349,11 +345,11 @@ export class DiscreteLegend extends LegendBase {
     _appendDataToShape(shape, name, data, delegateShape, states = {}) {
         shape.name = name, shape.data = data, shape.delegate = delegateShape, shape.states = merge({}, DEFAULT_STATES, states);
     }
-    _dispatchEvent(eventName, legendItem, event) {
-        var _a;
+    _dispatchLegendEvent(eventName, legendItem, event) {
         const currentSelectedItems = this._getSelectedLegends();
         currentSelectedItems.sort(((pre, next) => pre.index - next.index));
-        const currentSelected = currentSelectedItems.map((obj => obj.label)), changeEvent = new CustomEvent(eventName, {
+        const currentSelected = currentSelectedItems.map((obj => obj.label));
+        this._dispatchEvent(eventName, {
             item: legendItem,
             data: legendItem.data,
             selected: legendItem.hasState(LegendStateValue.selected),
@@ -361,8 +357,6 @@ export class DiscreteLegend extends LegendBase {
             currentSelected: currentSelected,
             event: event
         });
-        changeEvent.manager = null === (_a = this.stage) || void 0 === _a ? void 0 : _a.eventSystem.manager, 
-        this.dispatchEvent(changeEvent);
     }
     _handleStyle(config, item, isSelected, index, items) {
         const newConfig = merge({}, config);