search

ReTtiChDieOrganisation / ReTtiChDasRepo

ReTtiCh
https://rettichdieorganisation.github.io/ReTtiChDasRepo/
3 stars 0 forks source link

Remove polyline duplicates - build icon from three images #68

Open Flo1314 opened 1 year ago

prosauer commented 1 year ago 
<!DOCTYPE html>
<html>
<head>
    <title>Overlay Images</title>
</head>
<body>
    <canvas id="canvas" width="400" height="400"></canvas>

    <script>
        var canvas = document.getElementById("canvas");
        var context = canvas.getContext("2d");

        // Load your images
        var image1 = new Image();
        var image2 = new Image();
        var image3 = new Image();

        image1.src = "image1.png";
        image2.src = "image2.png";
        image3.src = "image3.png";

        // Ensure all images are loaded before drawing
        image1.onload = function () {
            context.drawImage(image1, 0, 0, canvas.width, canvas.height);
            image2.onload = function () {
                context.drawImage(image2, 0, 0, canvas.width, canvas.height);
                image3.onload = function () {
                    context.drawImage(image3, 0, 0, canvas.width, canvas.height);

                    // You can apply additional effects or transformations here

                };
            };
        };
    </script>
</body>
</html>
Flo1314 commented 1 year ago

works, issue will be fixed soon

Flo1314 commented 1 year ago

@FelixTe:

icon: L.icon({
    iconUrl: current_rider.get_frame().frame_fg,
    iconAnchor: current_rider.get_frame().anchor, 
    iconSize: current_rider.get_frame().size}
)}

L.icon will halt ne iconUrl. Selbst wenn wir es schaffen die Bilder übereinander zu legen und in ner js variable zu speichern, würde uns das hier nicht weiterhelfen..

Flo1314 commented 1 year ago

man kann halt in icons/ nen temp/ Ordner erstellen und da die Bilder, zusammengefügt, speichern und laden.. und dann löschen und neu bauen wenn der rider ein neues icon bekommt, wie bei Segmenten bspw

alles automatisiert natürlich. also den temp/ Ordner gibts nur wenn die html läuft und wird am ende wieder gelöscht. Aber das ist super hacky. Ich denke nicht dass ne browser Applikation das lokale Ordnersystem verändern können sollte aber was weiß ich schon über webdevelopment

FelixTe commented 1 year ago

Hm komplizierter als erwartet. Vielleicht gibt es irgendwie eine Art Marker aneinander zu Koppeln

Flo1314 commented 1 year ago

schlecht schlecht, das ist alles schlecht

Flo1314 commented 1 year ago

https://www.syncfusion.com/succinctly-free-ebooks/leafletjs/adding-overlays

vielleicht ist da was dabei..

prosauer commented 1 year ago

Vielleicht mit L.divIcon? Da kann man html als input reinhauen. Vielleicht kriegt man so das zusammengebastelte Bild rein?

https://docs.eegeo.com/eegeo.js/v0.1.740/docs/leaflet/L.DivIcon/