Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(plugin): add fisheye plugin #6235

Merged
merged 5 commits into from
Aug 27, 2024
Merged

feat(plugin): add fisheye plugin #6235

merged 5 commits into from
Aug 27, 2024

Conversation

yvonneyx
Copy link
Contributor

@yvonneyx yvonneyx commented Aug 23, 2024

Aug-23-2024 15-07-09
Aug-23-2024 15-28-39

Fisheye Options are as follows:

interface FisheyeOptions extends BasePluginOptions {
  /**
   * <zh/> 移动鱼眼放大镜的方式
   * - `'pointermove'`:始终跟随鼠标移动
   * - `'click'`:鼠标点击时移动
   * - `'drag'`:拖拽移动
   *
   * <en/> The way to move the fisheye lens
   * - `'pointermove'`: always follow the mouse movement
   * - `'click'`: move when the mouse is clicked
   * - `'drag'`: move by dragging
   * @defaultValue `'pointermove'`
   */
  trigger?: 'pointermove' | 'drag' | 'click';
  /**
   * <zh/> 鱼眼放大镜半径
   *
   * <en/> The radius of the fisheye lens
   * @remarks
   * <img src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*unAvQqAb_NMAAAAAAAAAAAAADmJ7AQ/original" width="200" />
   * @defaultValue 120
   */
  r?: number;
  /**
   * <zh/> 鱼眼放大镜可调整的最大半径,配合 `scaleRBy` 使用
   *
   * <en/> The maximum radius that the fisheye lens can be adjusted, used with `scaleRBy`
   * @defaultValue 画布宽高的最小值的一半
   */
  maxR?: number;
  /**
   * <zh/> 鱼眼放大镜可调整的最小半径,配合 `scaleRBy` 使用
   *
   * <en/> The minimum radius that the fisheye lens can be adjusted, used with `scaleRBy`
   * @defaultValue 0
   */
  minR?: number;
  /**
   * <zh/> 调整鱼眼放大镜范围半径的方式
   * - `'wheel'`:滚轮调整
   * - `'drag'`:拖拽调整,
   * - `'unset'`:不可调整
   *
   * <en/> The way to adjust the range radius of the fisheye lens
   * - `'wheel'`: adjust by wheel
   * - `'drag'`: adjust by drag
   * - `'unset'`: not adjustable
   * @defaultValue 'unset'
   * @remarks
   * <zh/> 如果 `trigger`、`scaleRBy` 和 `scaleDBy` 同时设置为 `'drag'`,优先级顺序为 `trigger` > `scaleRBy` > `scaleDBy`,只会为优先级最高的配置项绑定拖拽事件。同理,如果 `scaleRBy` 和 `scaleDBy` 同时设置为 `'wheel'`,只会为 `scaleRBy` 绑定滚轮事件
   *
   * <en/> If `trigger`, `scaleRBy`, and `scaleDBy` are set to `'drag'` at the same time, the priority order is `trigger` > `scaleRBy` > `scaleDBy`, and only the configuration item with the highest priority will be bound to the drag event. Similarly, if `scaleRBy` and `scaleDBy` are set to `'wheel'` at the same time, only `scaleRBy` will be bound to the wheel event
   */
  scaleRBy?: 'wheel' | 'drag' | 'unset';
  /**
   * <zh/> 畸变因子
   *
   * <en/> Distortion factor
   * @remarks
   * <img src="https://mdn.alipayobjects.com/huamei_qa8qxu/afts/img/A*4ITFR7GOl8UAAAAAAAAAAAAADmJ7AQ/original" width="200" />
   * @defaultValue 1.5
   */
  d?: number;
  /**
   * <zh/> 鱼眼放大镜可调整的最大畸变因子,配合 `scaleDBy` 使用
   *
   * <en/> The maximum distortion factor that the fisheye lens can be adjusted, used with `scaleDBy`
   * @defaultValue 5
   */
  maxD?: number;
  /**
   * <zh/> 鱼眼放大镜可调整的最小畸变因子,配合 `scaleDBy` 使用
   *
   * <en/> The minimum distortion factor that the fisheye lens can be adjusted, used with `scaleDBy`
   * @defaultValue 0
   */
  minD?: number;
  /**
   * <zh/> 调整鱼眼放大镜畸变因子的方式
   * - `'wheel'`:滚轮调整
   * - `'drag'`:拖拽调整
   * - `'unset'`:不可调整
   *
   * <en/> The way to adjust the distortion factor of the fisheye lens
   * - `'wheel'`: adjust by wheel
   * - `'drag'`: adjust by drag
   * - `'unset'`: not adjustable
   * @defaultValue 'unset'
   */
  scaleDBy?: 'wheel' | 'drag' | 'unset';
  /**
   * <zh/> 是否在鱼眼放大镜中显示畸变因子数值
   *
   * <en/> Whether to display the value of the distortion factor in the fisheye lens
   * @defaultValue true
   */
  showDPercent?: boolean;
  /**
   * <zh/> 鱼眼放大镜样式
   *
   * <en/> Fisheye Lens Style
   */
  style?: Partial<CircleStyleProps>;
  /**
   * <zh/> 在鱼眼放大镜中的节点样式
   *
   * <en/> Node style in the fisheye lens
   */
  nodeStyle?: NodeStyle | ((datum: NodeData) => NodeStyle);
  /**
   * <zh/> 是否阻止默认事件
   *
   * <en/> Whether to prevent the default event
   * @defaultValue true
   */
  preventDefault?: boolean;
}

@@ -21,7 +21,7 @@ export enum CanvasEvent {
*
* <en/> Triggered when the pointer enters
*/
POINTER_OVER = 'canvas:canvas:pointerover',
POINTER_OVER = 'canvas:pointerover',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

之前居然有这么严重的错误

@yvonneyx yvonneyx merged commit df139d4 into v5 Aug 27, 2024
3 checks passed
@yvonneyx yvonneyx deleted the plugin-fisheye branch August 27, 2024 03:27
@hustcc
Copy link
Member

hustcc commented Aug 28, 2024

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants