كيف استخدم Api رادار المطر من rainviewer

تمام عصام · 24 أغسطس

لقد بحثت كثيرا و لم اجد الطريقة الصحيح لكيف استخدام و انشاء خريطة رادرار المطر او السحب من rainviewer

لقد وجدت هذه الصفحة

https://www.rainviewer.com/sa/api/single-radar-data.html

و

https://www.rainviewer.com/sa/api/weather-maps-api.html

و كذلك وجدت

https://api.rainviewer.com/public/weather-maps.json

عند فتحه تظهر

{"version":"2.0","generated":1724487332,"host":"https://tilecache.rainviewer.com","radar":{"past":[{"time":1724479800,"path":"/v2/radar/1724479800"},{"time":1724480400,"path":"/v2/radar/1724480400"},{"time":1724481000,"path":"/v2/radar/1724481000"},{"time":1724481600,"path":"/v2/radar/1724481600"},{"time":1724482200,"path":"/v2/radar/1724482200"},{"time":1724482800,"path":"/v2/radar/1724482800"},{"time":1724483400,"path":"/v2/radar/1724483400"},{"time":1724484000,"path":"/v2/radar/1724484000"},{"time":1724484600,"path":"/v2/radar/1724484600"},{"time":1724485200,"path":"/v2/radar/1724485200"},{"time":1724485800,"path":"/v2/radar/1724485800"},{"time":1724486400,"path":"/v2/radar/1724486400"},{"time":1724487000,"path":"/v2/radar/1724487000"}],"nowcast":[{"time":1724487600,"path":"/v2/radar/nowcast_c277f4444b28"},{"time":1724488200,"path":"/v2/radar/nowcast_c2771b16e7ac"},{"time":1724488800,"path":"/v2/radar/nowcast_c2774d641e05"}]},"satellite":{"infrared":[{"time":1724479800,"path":"/v2/satellite/74d1db794db1"},{"time":1724480400,"path":"/v2/satellite/fc79b636f1b0"},{"time":1724481000,"path":"/v2/satellite/8d0d6cbef209"},{"time":1724481600,"path":"/v2/satellite/dbe1699d2f79"},{"time":1724482200,"path":"/v2/satellite/945aa568e0fc"},{"time":1724482800,"path":"/v2/satellite/1d77942251f2"},{"time":1724483400,"path":"/v2/satellite/1a5413b2ff29"},{"time":1724484000,"path":"/v2/satellite/a2e9cad3283e"},{"time":1724484600,"path":"/v2/satellite/0e03dc39bd2f"},{"time":1724485200,"path":"/v2/satellite/41891264b535"},{"time":1724485800,"path":"/v2/satellite/ea77e0fc095b"},{"time":1724486400,"path":"/v2/satellite/339139b8ce98"},{"time":1724487000,"path":"/v2/satellite/929141138305"}]}}

و هذا كود لخريطة المطر و السحب لكن لا نتيجة

<!DOCTYPE html>

<head>

<title>خريطة رادار المطر والسحب</title>

<style>

#map {

height: 600px;

width: 100%;

}

.leaflet-control-attribution {

display: none; /* إخفاء حقوق الخريطة الافتراضية */

}

</style>

</head>

<body>

// إعداد الخريطة وتحديد الموقع الافتراضي على السعودية

var map = L.map('map').setView([24.7, 46.7], 6);

// إضافة طبقة خريطة سوداء من CartoDB Dark Matter

L.tileLayer('https://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png', {

maxZoom: 19

}).addTo(map);

var baseUrl = "https://tilecache.rainviewer.com";

var pastRadarLayers = [];

var satelliteLayers = [];

var currentRadarLayer, currentSatelliteLayer;

// دالة لتحميل البيانات وتحديث الخريطة

function updateMap() {

fetch('https://api.rainviewer.com/public/weather-maps.json')

.then(response => response.json())

.then(data => {

if (!data || !data.radar || data.radar.past.length === 0) {

alert("لا توجد بيانات متاحة حاليًا لرادار المطر.");

return;

}

// مسح الطبقات السابقة

pastRadarLayers.forEach(layer => map.removeLayer(layer));

satelliteLayers.forEach(layer => map.removeLayer(layer));

pastRadarLayers = [];

satelliteLayers = [];

// إنشاء طبقات الرادار السابقة

data.radar.past.forEach(function(radarData) {

var tileLayer = L.tileLayer(baseUrl + radarData.path + "/256/{z}/{x}/{y}.png", {

opacity: 0.5

});

pastRadarLayers.push(tileLayer);

});

// إنشاء طبقات السحب من بيانات الأقمار الصناعية

if (data.satellite && data.satellite.infrared.length > 0) {

data.satellite.infrared.forEach(function(satelliteData) {

var tileLayer = L.tileLayer(baseUrl + satelliteData.path + "/256/{z}/{x}/{y}.png", {

opacity: 0.3

});

satelliteLayers.push(tileLayer);

});

} else {

alert("لا توجد بيانات متاحة حاليًا للسحب.");

}

// عرض الطبقة الأحدث (أحدث وقت) من طبقات الرادار

currentRadarLayer = pastRadarLayers[pastRadarLayers.length - 1];

currentRadarLayer.addTo(map);

// عرض الطبقة الأحدث من السحب

if (satelliteLayers.length > 0) {

currentSatelliteLayer = satelliteLayers[satelliteLayers.length - 1];

currentSatelliteLayer.addTo(map);

}

})

.catch(error => {

alert("حدث خطأ أثناء تحميل البيانات: " + error.message);

});

}

// تحديث الخريطة كل 10 دقائق (600,000 مللي ثانية)

setInterval(updateMap, 600000);

// التحديث الأولي للخريطة عند التحميل

updateMap();

</script>

</body>

</html>

تم التعديل في 24 أغسطس بواسطة تمام عصام

عبد الوهاب بومعراف · 24 أغسطس

أعتقد أنّ المشكلة قد تكون في طريقة بناء URL لطبقات الرادار والأقمار الصناعية هنا:

var tileLayer = L.tileLayer(baseUrl + radarData.path + "/256/{z}/{x}/{y}.png", {
    opacity: 0.5
});

و

var tileLayer = L.tileLayer(baseUrl + satelliteData.path + "/256/{z}/{x}/{y}.png", {
    opacity: 0.3
});

لذا يجب تعديل هذه الأسطر لتتوافق مع الصيغة الصحيحة لـ RainViewer API والصيغة الصحيحة هي:

var tileLayer = L.tileLayer(baseUrl + radarData.path + "/{z}/{x}/{y}/2/1_1.png", {
    opacity: 0.5
});

و

var tileLayer = L.tileLayer(baseUrl + satelliteData.path + "/{z}/{x}/{y}/2/1_1.png", {
    opacity: 0.3
});

وهذا وفقا لتوثيق RainViewer API وقد يكون السبب في عدم تحميل البيانات بشكل صحيح من API الخاص بـ RainViewer أو عدم إضافة طبقات الخريطة بشكل صحيح إلى عنصر الخريطة.

كيف استخدم Api رادار المطر من rainviewer

السؤال

تمام عصام

1 جواب على هذا السؤال

Recommended Posts

عبد الوهاب بومعراف

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية