zoom svg in javascript

To zoom an SVG element using JavaScript, you can use the transform attribute on the SVG element to apply a scaling transformation. Here's how you can achieve it:

1. Get a reference to the SVG DOM element that you want to zoom.

index.tsx
const svgElement = document.getElementById('my-svg-element');
62 chars
2 lines

2. Define a scaling factor to zoom in or out.

index.tsx
const scaleFactor = 1.5; // Zoom in by 50%
43 chars
2 lines

3. Apply the scaling transformation using the transform attribute.

index.tsx
const scaleTransform = `scale(${scaleFactor})`;
svgElement.setAttribute('transform', scaleTransform);
102 chars
3 lines

This will zoom the SVG element by the specified scaling factor. You can also use this technique to implement panning and other transformations on your SVG elements.