Εικών
Παρακάτω είναι ένα παράδειγμα του τρόπου λήψης δεδομένων καιρού με το Leaflet.js και το δωρεάν apiOpen-Meteo.

Το παράδειγμα είναι πολύ βασικό, κάνοντας κλικ σε κάποιο σημείο του χάρτη θα δημιουργηθεί ένας δείκτης με κάποια από τα μετεωρολογικά δεδομένα που επιστρέφει το API.Open-Meteo.
Open-Meteo(Εντελώς δωρεάν)
Περιγραφή : Δωρεάν API καιρού χωρίς εγγραφή. Προσφέρει δεδομένα καιρού από ανοιχτές πηγές.
Προσφερόμενα δεδομένα : Τρέχον καιρό, προβλέψεις, χωρίς όρια κλήσεων.
Ιστοσελίδα :Open-Meteo
Κάντε κλικ κάπου στον χάρτη...
Φυλλάδιο © Συνεισφέροντες OpenStreetMap
Φυλλάδιο © Συνεισφέροντες OpenStreetMap
Παράδειγμα κώδικα (Javascript)

        // Initialize the map
        var map = L.map('map').setView([0, 0], 2);

        // Add OpenStreetMap tiles
        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            maxZoom: 18,
            attribution: '© OpenStreetMap contributors'
        }).addTo(map);


        // Función para obtener datos meteorológicos de Open-Meteo
        async function getWeather(lat, lon) {
            const url = `https://api.open-meteo.com/v1/forecast?latitude=${lat}&longitude=${lon}¤t_weather=true`;
            const response = await fetch(url);
            const data = await response.json();
            return data.current_weather;
        }

        // Función para agregar marcadores de clima al mapa
        async function addWeatherMarker(lat, lon) {
            const weather = await getWeather(lat, lon);
            const marker = L.marker([lat, lon]).addTo(map);
            marker.bindPopup(`
                <b>Ubication</b><br>
                weathercode: ${weather.weathercode}<br>
                temperature: ${weather.temperature} °C<br>
                windspeed: ${weather.windspeed} km/h
            `).openPopup();
        }

        map.on('click', function(e) {        
                addWeatherMarker(e.latlng.lat, e.latlng.lng);      
            });




Comentar:
captcha

Comentarios: Sin comentarios

Το στοιχείο βίντεο είναι ένα από τα πιο σημαντικά χαρακτηριστικά της HTML5, καθώς επιτρέπει στους προγραμματιστές να ενσωματώνουν βίντεο απευθ�...

Seguir leyendo...

Το παρακάτω άρθρο δείχνει ένα βασικό παράδειγμα για τον τρόπο ενεργοποίησης της κάμερας και του ήχου με Javascript....

Seguir leyendo...

Η σωστή εσοχή κάνει τον κώδικα HTML πιο ευανάγνωστο και κατανοητό. Όταν οι ετικέτες HTML είναι καλά οργανωμένες και ένθετες σωστά, είναι ευκολότερ...

Seguir leyendo...

Το στοιχείο ήχου σε HTML είναι ένα ισχυρό εργαλείο για την ενσωμάτωση περιεχομένου ήχου σε ιστοσελίδες....

Seguir leyendo...

Παρακάτω μπορείτε να βρείτε τις απαραίτητες εντολές για να πραγματοποιήσετε μια σωστή εγκατάσταση του PyQt6...

Seguir leyendo...

Ο καλά μορφοποιημένος κώδικας παρέχει έναν σαφή οπτικό οδηγό για τον τρόπο εφαρμογής των στυλ και τον τρόπο ομαδοποίησης των κανόνων. Ο κώδικ�...

Seguir leyendo...

Η εσοχή κώδικα JavaScript όχι μόνο βελτιώνει την αισθητική του κώδικα, αλλά προσφέρει επίσης σημαντικά πρακτικά οφέλη που διευκολύνουν την ανάγνω�...

Seguir leyendo...

(GIS) στον Ιστό έχουν φέρει επανάσταση στον τρόπο αλληλεπίδρασης με χωρικά δεδομένα, παρακάτω είναι οι πιο σημαντικές βιβλιοθήκες JS....

Seguir leyendo...

Για εργασίες μηχανικής μετάφρασης, τα μοντέλα που βασίζονται στην αρχιτεκτονική του Transformer έχουν αποδειχθεί πολύ αποτελεσματικά....

Seguir leyendo...

Εξερευνήστε τα πλεονεκτήματα του Kotlin έναντι της Java στην ανάπτυξη εφαρμογών Android....

Seguir leyendo...

Ανακαλύψτε τα βασικά βήματα για να ανεβάσετε τις εφαρμογές σας στο Play Store και γίνετε επιτυχημένος προγραμματιστής....

Seguir leyendo...

Παρακάτω είναι ένας χάρτης Leaflet.js στον οποίο ο χρήστης μπορεί να πάρει το υψόμετρο αφού κάνει κλικ σε μια συγκεκριμένη τοποθεσία....

Seguir leyendo...