Image click area links to data

Sotirios Zormpas  Hello
I'm asking GPT to edit the information you provided. I don't know if there is a problem. Now it can be used normally. Thank you very much.

let accounts := (select Accounts where sss = "A1" or sss = "A2" or sss = "A3" or sss = "A4");
let myGeoJson := {
        type: "FeatureCollection",
        features: accounts.{
            type: "Feature",
            properties: {
                id: '身份標識',
                name: sss,
                status: text(Status),
                sss: sss
            },
            geometry: {
                type: "Point",
                coordinates: if sss = "A1" then
                    [350, 1200]
                else
                    if sss = "A2" then
                        [800, 1200]
                    else
                        if sss = "A3" then [1200, 1200] else [1600, 1200] end
                    end
                end
            }
        }
    };
let myGeoJsonString := formatJSON(myGeoJson);
html("
<link rel='stylesheet' href='https://unpkg.com/leaflet@1.9.4/dist/leaflet.css' 
    integrity='sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=' crossorigin=''/>
<script src='https://unpkg.com/leaflet@1.9.4/dist/leaflet.js'
    integrity='sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=' crossorigin=''></script>

<div id='map' style='height: 600px; width: 100%;'></div>

<script>
setTimeout(function(){
    var map = L.map('map', {
        crs: L.CRS.Simple,
        minZoom: -2
    });

    var bounds = [[0, 0], [2400, 3600]];
    var imageUrl = 'https://share.ninox.com/k2jqsnmrob7xi7adsye16uqat6nlwbny1pkn';

    L.imageOverlay(imageUrl, bounds).addTo(map);
    map.fitBounds(bounds);

    var markerOptions = {
        radius: 10,
        weight: 2,
        opacity: 1,       // 邊界透明度
        fillOpacity: 0.6  // 填充透明度
    };

    var geoJsonLayer = L.geoJSON(" +
myGeoJsonString +
", {
        pointToLayer: function (feature, latlng) {
            return L.circleMarker(latlng, markerOptions);
        },
        style: function (feature) {
            // 根據狀態設定顏色和透明度
            switch (feature.properties.status) {
                case 'Active': return {color: '#00FF00', fillOpacity: 0.5};  // 綠色，半透明
                case 'Suspended': return {color: '#005AFF', fillOpacity: 0.5};  // 藍色，半透明
                case 'Deactivated': return {color: '#FF0000', fillOpacity: 0.5};  // 紅色，半透明
                default: return {color: '#000000', fillOpacity: 0.5};  // 默認黑色，半透明
            }
        },
        onEachFeature: function (feature, layer) {
            layer.bindTooltip(feature.properties.sss);  // 顯示 A1, A2, A3, A4
            layer.on('click', function() {
                ui.popupRecord(feature.properties.id);
            });
        }
    }).addTo(map);

}, 1000);
</script>
")