johan
/
vault1984-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: use SVG <image> to load worldmap.svg instead of fetch+DOMParser 

fetch+DOMParser+importNode was unreliable in real Chrome.
Native SVG <image href> reference is simpler and works everywhere.
This commit is contained in:
James 2026-03-02 01:58:22 -05:00
parent a8e8376e39
commit 5d52c90399
2 changed files with 1 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
hosted.html
View File

@ -76,7 +76,7 @@
<div class="relative mb-4 rounded-2xl overflow-hidden border border-white/5"> <div class="relative mb-4 rounded-2xl overflow-hidden border border-white/5">
<svg id="worldmap" viewBox="0 0 1000 460" xmlns="http://www.w3.org/2000/svg" class="w-full" style="display:block;background:#0a1628;"> <svg id="worldmap" viewBox="0 0 1000 460" xmlns="http://www.w3.org/2000/svg" class="w-full" style="display:block;background:#0a1628;">
<!-- geography: see worldmap.svg --> <image href="/worldmap.svg" x="0" y="0" width="1000" height="460"/>
<circle cx="284.7" cy="143.8" r="4" fill="none" stroke="#22C55E" stroke-width="1.5"><animate attributeName="r" values="4;13;4" dur="2.4s" begin="0.00s" repeatCount="indefinite"/><animate attributeName="stroke-opacity" values="0.6;0;0.6" dur="2.4s" begin="0.00s" repeatCount="indefinite"/></circle> <circle cx="284.7" cy="143.8" r="4" fill="none" stroke="#22C55E" stroke-width="1.5"><animate attributeName="r" values="4;13;4" dur="2.4s" begin="0.00s" repeatCount="indefinite"/><animate attributeName="stroke-opacity" values="0.6;0;0.6" dur="2.4s" begin="0.00s" repeatCount="indefinite"/></circle>
<circle cx="284.7" cy="143.8" r="4" fill="none" stroke="#22C55E" stroke-width="1"><animate attributeName="r" values="4;13;4" dur="2.4s" begin="0.80s" repeatCount="indefinite"/><animate attributeName="stroke-opacity" values="0.4;0;0.4" dur="2.4s" begin="0.80s" repeatCount="indefinite"/></circle> <circle cx="284.7" cy="143.8" r="4" fill="none" stroke="#22C55E" stroke-width="1"><animate attributeName="r" values="4;13;4" dur="2.4s" begin="0.80s" repeatCount="indefinite"/><animate attributeName="stroke-opacity" values="0.4;0;0.4" dur="2.4s" begin="0.80s" repeatCount="indefinite"/></circle>
<circle cx="284.7" cy="143.8" r="4.5" fill="#22C55E" stroke="#0a1628" stroke-width="1.5"/> <circle cx="284.7" cy="143.8" r="4.5" fill="#22C55E" stroke="#0a1628" stroke-width="1.5"/>
@ -517,23 +517,5 @@
.catch(() => {}); .catch(() => {});
})(); })();
</script> </script>
<script>
// Load geography paths from external SVG to keep this file manageable
(function(){
var svg = document.getElementById('worldmap');
if (!svg) return;
fetch('/worldmap.svg')
.then(function(r){ return r.text(); })
.then(function(txt){
var parser = new DOMParser();
var doc = parser.parseFromString(txt, 'image/svg+xml');
var children = Array.from(doc.documentElement.children);
var first = svg.firstChild;
children.reverse().forEach(function(child){
svg.insertBefore(document.importNode(child, true), first);
});
});
})();
</script>
</body> </body>
</html> </html>

BIN
vault1984-web
View File

Binary file not shown.