This example uses OpenLayers v10.9.0. The latest is v.
Edit

#### WMS loader with SVG format

wms 13 image 8 svg 2

#####

Using the WMS loader to use SVG images with an Image source.

The Image source can be configured with service specific loaders. By default, the loader returns the image as decoded `ImageBitmap`. When using the `ol/source/Image.load()` function instead, SVG images will scale during zooming, because they will be used as `HTMLImageElement` directly instead of an `ImageBitmap`.

##### main.js

    import {load} from 'ol/Image.js';
    import Map from 'ol/Map.js';
    import View from 'ol/View.js';
    import ImageLayer from 'ol/layer/Image.js';
    import TileLayer from 'ol/layer/Tile.js';
    import ImageSource from 'ol/source/Image.js';
    import OSM from 'ol/source/OSM.js';
    import {createLoader} from 'ol/source/wms.js';

    const layers = [
      new TileLayer({
        source: new OSM(),
      }),
      new ImageLayer({
        extent: [-13884991, 2870341, -7455066, 6338219],
        source: new ImageSource({
          loader: createLoader({
            url: 'https://ahocevar.com/geoserver/wms',
            params: {'LAYERS': 'topp:states', 'FORMAT': 'image/svg+xml'},
            ratio: 1,
            load: load,
          }),
        }),
      }),
    ];
    const map = new Map({
      layers: layers,
      target: 'map',
      view: new View({
        center: [-10997148, 4569099],
        zoom: 4,
      }),
    });

##### index.html

    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="UTF-8">
        <title>WMS loader with SVG format</title>
        <link rel="stylesheet" href="node_modules/ol/ol.css">
        <style>
          .map {
            width: 100%;
            height: 400px;
          }
        </style>
      </head>
      <body>
        <div id="map" class="map"></div>

        <script type="module" src="main.js"></script>
      </body>
    </html>

##### package.json

    {
      "name": "wms-image-svg",
      "dependencies": {
        "ol": "10.9.0"
      },
      "devDependencies": {
        "vite": "^3.2.3"
      },
      "scripts": {
        "start": "vite",
        "build": "vite build"
      }
    }