Fisheye is designed for focus+context exploration, it keeps the context and the relationships between context and the focus while magnifying the focus area.

Options

Required type

string

Plugin type

d

number Default: 1.5

Distortion factor

maxD

number Default: 5

The maximum distortion factor that the fisheye lens can be adjusted, used with scaleDBy

maxR

number Default: 画布宽高的最小值的一半

The maximum radius that the fisheye lens can be adjusted, used with scaleRBy

minD

number Default: 0

The minimum distortion factor that the fisheye lens can be adjusted, used with scaleDBy

minR

number Default: 0

The minimum radius that the fisheye lens can be adjusted, used with scaleRBy

nodeStyle

NodeStyle | ((datum: NodeData) => NodeStyle__)

Node style in the fisheye lens

preventDefault

boolean Default: true

Whether to prevent the default event

r

number Default: 120

The radius of the fisheye lens

scaleDBy

'wheel' | 'drag'

The way to adjust the distortion factor of the fisheye lens

• 'wheel': adjust by wheel

• 'drag': adjust by drag

scaleRBy

'wheel' | 'drag'

The way to adjust the range radius of the fisheye lens

• 'wheel': adjust by wheel

• 'drag': adjust by drag

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

showDPercent

boolean Default: true

Whether to display the value of the distortion factor in the fisheye lens

style

CircleStyleProps

Fisheye Lens Style

trigger

'pointermove' | 'drag' | 'click' Default: ``

The way to move the fisheye lens

• 'pointermove': always follow the mouse movement

• 'click': move when the mouse is clicked

• 'drag': move by dragging

API

Fisheye.destroy()

destroy(): void;

Fisheye.update(options)

update(options: Partial<FisheyeOptions>): void;