Custom marker icons 404 and symbols render blank

• GET /icons/pin.png 404 and GET /icons/pin@2x.png 404 in the network panel.
• Uncaught Error: Could not load image because of 404 Not Found at maplibre-gl.js:4211.
• Images sometimes return 200 yet no icon appears and no error is logged.

1. Load the image in a plain Image object and print width and height to confirm the URL.
2. Check map.hasImage('pin') after registration.
3. Verify the page base path, since ./icons/pin.png under /project/detail resolves to /project/icons/pin.png.
4. Check pixelRatio and whether an @2x asset exists.

Use map.loadImage for both 1x and 2x, then map.addImage('pin', image.data, { pixelRatio: 1 }) and pixelRatio 2 before creating the symbol layer, building URLs from an absolute ICON_BASE.

Uncaught Error: Could not load image because of 404 Not Found.
    at maplibre-gl.js:4211

GET /icons/pin.png 404 (Not Found)
GET /icons/pin@2x.png 404 (Not Found)

var img = new Image();
img.onload = function () { console.log('图片尺寸', img.width, img.height); };
img.onerror = function (e) { console.error('图片加载失败', e); };
img.src = '/icons/pin.png';
console.log('已注册图标', map.hasImage('pin'));

• Registering the image after the layer exists does not refresh existing symbols until icon-image is set again.
• Passing an HTMLImageElement that has not finished decoding registers an empty or wrongly sized image.