From 4e4b5cad71796086d4e10ff19720c542009349bd Mon Sep 17 00:00:00 2001 From: root Date: Mon, 13 Nov 2023 21:29:50 +0800 Subject: [PATCH 1/7] fix: scroll, legend hover style, cursor pointer --- src/core/types.ts | 4 ++-- src/ui/legend/continuous.ts | 11 ++++++++++- src/ui/slider/index.ts | 4 ++-- 3 files changed, 14 insertions(+), 5 deletions(-) diff --git a/src/core/types.ts b/src/core/types.ts index a36d3b6e6..41bf63e70 100644 --- a/src/core/types.ts +++ b/src/core/types.ts @@ -19,8 +19,8 @@ export type PrefixStyleProps, P extends string> = [K in keyof T as K extends `show${infer S}` ? `show${Capitalize

}${S}` : K extends string - ? `${P}${Capitalize}` - : never]: T[K]; + ? `${P}${Capitalize}` + : never]: T[K]; }; export type CallableStyleProps, P extends any[]> = { diff --git a/src/ui/legend/continuous.ts b/src/ui/legend/continuous.ts index 1a02416b4..5c5e15c2a 100644 --- a/src/ui/legend/continuous.ts +++ b/src/ui/legend/continuous.ts @@ -2,7 +2,7 @@ import { CustomEvent } from '@antv/g'; import { Linear } from '@antv/scale'; import { clamp, isUndefined } from '@antv/util'; import { Component } from '../../core'; -import type { DisplayObject, TextStyleProps } from '../../shapes'; +import type { BaseStyleProps, DisplayObject, TextStyleProps } from '../../shapes'; import { Group } from '../../shapes'; import { Point } from '../../types'; import { @@ -45,6 +45,7 @@ function getMinMax(data: ContinuousDatum[]) { export class Continuous extends Component { constructor(options: ContinuousOptions) { + console.log('continunes'); super(options, CONTINUOUS_DEFAULT_OPTIONS); } @@ -322,6 +323,8 @@ export class Continuous extends Component { this.update({ labelText }); const name = `${type}Handle` as `${HandleType}Handle`; that[name] = this; + this.addEventListener('pointerover', that.changeCursor('pointer')); + this.addEventListener('pointerleave', that.changeCursor('default')); this.addEventListener('pointerdown', that.onDragStart(type)); }), (update) => @@ -737,4 +740,10 @@ export class Continuous extends Component { }); this.dispatchEvent(evt as any); } + + private changeCursor(cursor: BaseStyleProps['cursor'] = 'default') { + return (e: any) => { + this.style.cursor = cursor; + }; + } } diff --git a/src/ui/slider/index.ts b/src/ui/slider/index.ts index 8ba7b72a4..7f660b571 100644 --- a/src/ui/slider/index.ts +++ b/src/ui/slider/index.ts @@ -287,8 +287,8 @@ export class Slider extends Component { this.addEventListener('pointerdown', () => { this.attr('cursor', 'grabbing'); }); - this.addEventListener('pointerup', () => { - this.attr('cursor', 'grab'); + this.addEventListener('pointerover', () => { + this.attr('cursor', 'pointer'); }); } else { this.on('pointerdown', that.onDragStart('track')); From 15e111d4c92984fa1746e614c442e9ef69079edb Mon Sep 17 00:00:00 2001 From: root Date: Mon, 13 Nov 2023 21:31:47 +0800 Subject: [PATCH 2/7] fix: remove console.log --- src/ui/legend/continuous.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/ui/legend/continuous.ts b/src/ui/legend/continuous.ts index 5c5e15c2a..0ba885001 100644 --- a/src/ui/legend/continuous.ts +++ b/src/ui/legend/continuous.ts @@ -45,7 +45,6 @@ function getMinMax(data: ContinuousDatum[]) { export class Continuous extends Component { constructor(options: ContinuousOptions) { - console.log('continunes'); super(options, CONTINUOUS_DEFAULT_OPTIONS); } From 1a2f5b69d6566aaefa111b1533a3ce947ce229c3 Mon Sep 17 00:00:00 2001 From: root Date: Mon, 13 Nov 2023 22:06:53 +0800 Subject: [PATCH 3/7] fix: legend-continuous pointer --- src/ui/legend/continuous.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/ui/legend/continuous.ts b/src/ui/legend/continuous.ts index 0ba885001..891646b36 100644 --- a/src/ui/legend/continuous.ts +++ b/src/ui/legend/continuous.ts @@ -323,7 +323,7 @@ export class Continuous extends Component { const name = `${type}Handle` as `${HandleType}Handle`; that[name] = this; this.addEventListener('pointerover', that.changeCursor('pointer')); - this.addEventListener('pointerleave', that.changeCursor('default')); + // this.addEventListener('pointerleave', that.changeCursor('default')); this.addEventListener('pointerdown', that.onDragStart(type)); }), (update) => @@ -575,6 +575,7 @@ export class Continuous extends Component { this.ribbon.on('pointerdown', this.onDragStart('ribbon')); this.ribbon.on('pointermove', this.onHovering); this.addEventListener('pointerout', this.hideIndicator); + this.addEventListener('pointerover', this.changeCursor('pointer')); } private onHovering = (e: any) => { @@ -651,7 +652,7 @@ export class Continuous extends Component { }; private onDragEnd = () => { - this.style.cursor = 'default'; + this.style.cursor = 'pointer'; document.removeEventListener('mousemove', this.onDragging); document.removeEventListener('touchmove', this.onDragging); document.removeEventListener('mouseup', this.onDragEnd); From 54100ca1c9e625dff52c070aeddc7a3050e07ca6 Mon Sep 17 00:00:00 2001 From: root Date: Tue, 14 Nov 2023 10:02:50 +0800 Subject: [PATCH 4/7] fix: remove unnecessary code --- src/ui/legend/continuous.ts | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/ui/legend/continuous.ts b/src/ui/legend/continuous.ts index 891646b36..5848e5cbb 100644 --- a/src/ui/legend/continuous.ts +++ b/src/ui/legend/continuous.ts @@ -322,8 +322,6 @@ export class Continuous extends Component { this.update({ labelText }); const name = `${type}Handle` as `${HandleType}Handle`; that[name] = this; - this.addEventListener('pointerover', that.changeCursor('pointer')); - // this.addEventListener('pointerleave', that.changeCursor('default')); this.addEventListener('pointerdown', that.onDragStart(type)); }), (update) => From a917c311ed406e95a7d7f5887bc62328b04f5274 Mon Sep 17 00:00:00 2001 From: root Date: Tue, 14 Nov 2023 10:13:23 +0800 Subject: [PATCH 5/7] fix: fix the style when over the dragging on scrollbar --- src/ui/slider/index.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/ui/slider/index.ts b/src/ui/slider/index.ts index 7f660b571..8607a2a78 100644 --- a/src/ui/slider/index.ts +++ b/src/ui/slider/index.ts @@ -287,6 +287,9 @@ export class Slider extends Component { this.addEventListener('pointerdown', () => { this.attr('cursor', 'grabbing'); }); + this.addEventListener('pointerup', () => { + this.attr('cursor', 'pointer'); + }); this.addEventListener('pointerover', () => { this.attr('cursor', 'pointer'); }); From 8fe22f11b79ea689b8e6578b792415c887c43650 Mon Sep 17 00:00:00 2001 From: Runtus <893119806@qq.com> Date: Thu, 23 Nov 2023 17:53:47 +0800 Subject: [PATCH 6/7] feat: update version --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 82ab363fa..af493c29b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@antv/component", - "version": "1.0.0-beta.2", + "version": "1.0.0", "description": "Visualization components for AntV, based on G.", "license": "MIT", "main": "lib/index.js", From 141cbb95f57154cca6c16c49f8a2ab1226fe9170 Mon Sep 17 00:00:00 2001 From: Runtus <893119806@qq.com> Date: Fri, 24 Nov 2023 12:25:51 +0800 Subject: [PATCH 7/7] fix: remove event on legend hover style --- src/ui/legend/continuous.ts | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/src/ui/legend/continuous.ts b/src/ui/legend/continuous.ts index 5848e5cbb..d391cf31d 100644 --- a/src/ui/legend/continuous.ts +++ b/src/ui/legend/continuous.ts @@ -569,11 +569,11 @@ export class Continuous extends Component { private prevValue!: number; public bindEvents() { + this.style.cursor = 'pointer'; // 绑定 drag 开始事件 this.ribbon.on('pointerdown', this.onDragStart('ribbon')); this.ribbon.on('pointermove', this.onHovering); this.addEventListener('pointerout', this.hideIndicator); - this.addEventListener('pointerover', this.changeCursor('pointer')); } private onHovering = (e: any) => { @@ -738,10 +738,4 @@ export class Continuous extends Component { }); this.dispatchEvent(evt as any); } - - private changeCursor(cursor: BaseStyleProps['cursor'] = 'default') { - return (e: any) => { - this.style.cursor = cursor; - }; - } }