CSS / JavaScript: Hilfe bei Leaflet-Integration?

Hallo Leute,

ich brauche Hilfe bei dieser Arbeit.

1. Es sollen zwei Karten nebeneinander sein. Jedoch soll die rechte Karte eine Here-Map sein. Wie baue ich das in den Code ein (siehe unten)?

Sie müssen http://ivansanchez.gitlab.io/Leaflet.TileLayer.HERE/leaflet-tilelayer-here.js in einem <script>-Tag laden. Danach müsste es mit sowas hier gehen:
L.tileLayer.here({
  appId: 'ViVS62MmsdTJSzwXMlHb',
  appCode: 'bsODmSCzkVqEMR8TnGPHdw'
}).addTo(map);
Statt addTo(map) kommt natürlich der Name Ihrer rechten Karte hin.
appId und appCode sind hier aus dem Beispiel von Ivan Sanchez http://ivansanchez.gitlab.io/Leaflet.TileLayer.HERE/demo.html

________________

2. Außerdem soll die zweite Karte sozusagen synchron/parallel mit der linken Karte verlaufen:

Sie müssen, wenn der Benutzer in der linken Karte zoomt oder sie verschiebt, die rechte Karte aktualisieren. Dazu müssen Sie eine Funktion schreiben, die aufgerufen wird, wenn auf der linken Karte das "zoomend" oder "moveend"-Ereignis auftritt.
Also etwa
map1.on("zoomend", meine_funktion);
und dann in der meine_funktion können Sie auf der rechten Karte "setBounds" aufrufen, um die rechte Karte zu verschieben/zu zoomen. Das "setBounds" muss dabei den aktuellen Ausschnitt der linken Karte übergeben bekommen (getBounds).

_________________________________________________

<html>
  <head>
    <link rel="stylesheet" href="https: //unpkg.com/leaflet@1.4.0/dist/leaflet.css"></link>
    <script src="https: //unpkg.com/leaflet@1.4.0/dist/leaflet.js"></script>
    <script src="http: //unpkg.com/leaflet@1.3.1/dist/leaflet.js"></script>
    <script>
      function initMaps() {
        map = new L.map('meine_map');
        L.tileLayer('https: //{s}.tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
        let karlsruhe = new L.LatLng(49, 8.4);
        map.setView(karlsruhe, 12);
        map1 = new L.map('meine_map1');
        L.tileLayer('http: //{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png').addTo(map1);
        map1.setView(karlsruhe, 12);

        document.getElementById("suchen").addEventListener("click", suchen);
      }

      async function suchen() {
        let url = new URL('https: //nominatim.openstreetmap.org/search');
        url.searchParams.append('format', 'json');
        url.searchParams.append('q', document.getElementById("ort").value);

        let response = await fetch(url);
        let json = await response.json();
        let box = json[0].boundingbox;

        map.fitBounds([ [ box[0],box[2] ], [ box[1],box[3] ] ]);
        map1.fitBounds([ [ box[0],box[2] ], [ box[1],box[3] ] ]);
      }
    </script>
  </head>
  <body onLoad="initMaps()">
    <div id="meine_map" style="height: 360px; width: 360px;"></div>
    <div id="meine_map1" style="position: absolute; top: 9px; left: 375px; height: 360px; width: 360px;"></div>
    <input type="text" id="ort">
    <button id="suchen">Suchen</button>
  </body>

Anmerkung: Damit der GF-Editor die URLs nicht verfälscht, wurde im Protokoll stets ein Leerzeichen hinzugefügt.

Ich danke euch für die Hilfe im Voraus!

LG

HTML, Programmieren, CSS, Java, JavaScript, HTML Code, Informatik, Informatiker
2 Antworten
Anwendung mit Lizenzschlüssel schützen?

Ich entwickle eine Anwendung, welche ich verkaufen möchte. Was heutzutage "normal" ist: Alle Anwendungen, die eigentlich Geld kosten, werden irgendwie gecrackt und weiter verkauft. Dem möchte ich vorbeugen.

Mein Ziel ist es, die Anwendung selbst kostenlos zum Download zur Verfügung zu stellen, aber nach Starten der Anwendung wird nach einem Produktschlüssel gefragt, den man sich kaufen muss.

Ich mache das ganze bisher wie folgt:
In einer MySQL-Datenbank, die global erreichbar ist, ist eine Tabelle mit allen Lizenzschlüssel. Gibt man den Produktschlüssel in der Anwendung ein, wird dieser an einen Server geschickt, der den Schlüssel überprüft. In meiner Datenbank sieht die Tabelle so aus:

Schlüssel | MaximaleBenutzungen | Benutzungen | UID
----------+---------------------+-------------+----
  ABC123  |          1          |      0      |

Die Überprüfung funktioniert so:

Existiert der Schlüssel?

  • Wenn ja und Benutzungen != MaximalBenutzungen => Statuscode 200 und Benutzungen auf 1 setzen.
  • Wenn ja und Benutzungen == MaximalBenutzungen => Statuscode 401.
  • Wenn nein => Statuscode 401.

Meine weitere Idee wäre, in der Anwendung eine Zufällige Zeichenkette (UID) generieren zu lassen, die mit an den Server geschickt wird, wenn der Statuscode 200 lautet. Diese wird dann auch lokal incl. dem Schlüssel abgespeichert (z.B. in einer SQLite-Datenbank) und nach jedem Anwendungsstart wird der Schlüssel erneut überprüft:

Der Schlüssel und die UID werden aus der lokalen Datenbank geholt und wieder an den Server gesendet. Dann überprüft der Server folgendes:

Existiert der Schlüssel?

  • Wenn ja und LokaleUID != UID => Statuscode 401.
  • Wenn ja und LokaleUID == UID => Statuscode 200.
  • Wenn nein => Fehlermeldung und lokalen Schlüssel löschen.

Hier ist jetzt mein Problem:

Angenommen ich würde jetzt auf einem zweiten PC die Anwendung herunterladen, finde die Datenbank auf dem PC und setze den Produktschlüssel mit der gleichen UID wie auf dem anderen PC in die Datenbank, dann ist das ja wieder gecrackt oder nicht? Es würde ja dann immer der Statuscode 200 zurück kommen.

Ist das überhaupt eine gute Lösung? Wenn nicht, was kann ich verbessern oder ändern? Und wie würdet ihr das Problem lösen?

Vielen Dank für eure Mühe!

Computer, Technik, Programmieren, Programmierung, Anwendungsentwicklung, development, Entwicklung, Informatik, Informatiker, Technologie, Computerprogramm, Spiele und Gaming
12 Antworten
Wie mit der Informatik einsteigen?

Ich interessiere mich schon seit jungen Kinderalter für die Informatik aber irgendwie war ich Jahrelang zu faul etwas richtig dafür zu tun... Natürlich habe ich als Kind mal sowas wie Gamemaker oder Scratch probiert aber sowas ist ja nicht zu vergleichen und eben auch für Kinder gedacht. Ich selber interessiere mich besonders für die Theorie hinter der Informatik liebe es aber noch mehr diese dann umzusetzen und das habe ich sogar bis Heute einfach nur aus Spaß mit Scratch gemacht, da es mir nicht darum ging ein neues Programm zu entwickeln sondern einfach Spaß mit der Denkarbeit zu haben... Die Möglichkeiten sind mit Scratch allerdings seeehr begrenzt und aus diesen Grund will ich mich jetzt endlich hinsetzten und dafür richtig was tun. Deswegen ist meine Frage.. Wie und womit soll ich anfangen? Lieber Konsolenbasierte Programmiersprachen wie Python (Leicht reingeschaut) oder 'Umfangreiche' wie C#, welche ich dann auch für Unity etc. verwenden kann.. (Vergessen zu schreiben.. Ich persönlich liebe auch das ganze Thema rundum KI !!! ).. Und wie soll ich am besten einsteigen? Mit einen Buch? Gibt es Empfehlungen? YouTube habe ich schon oft genug probiert, allerdings sind viele Video-Reihen komplett veraltet, unvollständig oder einfach nur komisch aufgebaut, sodass man nichts lernt sondern nur nachahmt....

Danke im Voraus :)

MFG Nico

Buch, lernen, Informatik, Informatiker, Künstliche Intelligenz
5 Antworten

Meistgelesene Fragen zum Thema Informatiker