Sencha chart에서 확대 축소 처리

 

itemhighlight: Highlights individual data points when hovered over.

panzoom: Enables zooming and panning using gestures or mouse.

zoomOnPanGesture: Enables zooming via gestures like pinch zoom or scroll wheel.
axes: Specifies which axes allow panning and zooming.

crosszoom: Allows rectangular zooming by dragging over a specific area.

zoomOnPanGesture: Disables zooming when dragging.

 

                interactions: [
                    {
                        type: 'itemhighlight', // Highlights data points on hover
                    },
                    {
                        type: 'panzoom', // Enables panning and zooming
                        zoomOnPanGesture: true,
                        axes: {
                            left: {
                                allowPan: true,
                                allowZoom: true,
                            },
                            bottom: {
                                allowPan: true,
                                allowZoom: true,
                            },
                        },
                    },
                    {
                        type: 'crosszoom', // Allows rectangular zoom on drag
                        zoomOnPanGesture: false,
                    },
                ],