Wie zeige ich eine Openstreetmap-Karte in C# und WPF an? Ich bekomme nur einen schwarzen Bildschirm ⇐ C#

[Anonymous]

In mainwindow.xaml.cs habe ich ein Umschaltschaltflächenereignis hinzugefügt, um von der aktuellen Modusansicht zur interaktiven Open Google Streetmap-Ansicht zu wechseln.
Oben habe ich Folgendes hinzugefügt:

Code: Select all

using Microsoft.Web.WebView2.Core;

und dann habe ich in meinem Code:

Code: Select all

private bool isMapMode = false;

und

Code: Select all

private async void BtnToggleMap_Click(object sender, RoutedEventArgs e)
{
isMapMode = !isMapMode;

if (isMapMode)
{
// Switch to MAP mode
BtnToggleMap.Content = "📡 חזור לתצוגת רדאר";
MapContainer.Visibility = Visibility.Visible;
RadarContainer.Visibility = Visibility.Collapsed;

string projectRoot = IOPath.GetFullPath(IOPath.Combine(AppDomain.CurrentDomain.BaseDirectory, @"..\..\..\"));
string htmlPath = IOPath.Combine(projectRoot, "Assets", "Map", "map.html");
string mapFolder = IOPath.Combine(projectRoot, "Assets", "Map");

try
{
if (!File.Exists(htmlPath))
{
Log("⚠ map.html not found in Assets/Map folder!");
return;
}

// Initialize WebView2
await MapView.EnsureCoreWebView2Async(null);

// Enable access for local radar images
string radarFolder = IOPath.Combine(projectRoot, "Assets", "Radar_Images");
MapView.CoreWebView2.SetVirtualHostNameToFolderMapping(
"radar.local", radarFolder, CoreWebView2HostResourceAccessKind.Allow);

// Enable access for map folder (for leaflet.css and leaflet.js)
MapView.CoreWebView2.SetVirtualHostNameToFolderMapping(
"map.local", mapFolder, CoreWebView2HostResourceAccessKind.Allow);

// Read and modify HTML to use virtual host
string htmlContent = File.ReadAllText(htmlPath);
MapView.NavigateToString(htmlContent);

Log("🌍 Loaded interactive map mode with local Leaflet files.");

// Wait for map to load
await Task.Delay(1500);

// Send radar frames to map
await SendRadarFramesToMap();
}
catch (Exception ex)
{
Log($"❌ Failed to initialize map: {ex.Message}");
}
}
else
{
// Switch back to RADAR mode
BtnToggleMap.Content = "🗺 הצג מפה אינטראקטיבית";
MapContainer.Visibility = Visibility.Collapsed;
RadarContainer.Visibility = Visibility.Visible;
Log("📡 Returned to radar image mode.");
}
}

und

Code: Select all

private async void MapView_NavigationCompleted(object? sender, CoreWebView2NavigationCompletedEventArgs e)
{
if (e.IsSuccess)
{
Log("✅ Map loaded successfully.");
// Send radar frames after map loads
await SendRadarFramesToMap();
}
else
{
Log($"❌ Map failed to load: {e.WebErrorStatus}");
}
}

Es erreicht diese Linie

Code: Select all

Log("✅ Map loaded successfully.");

aber was ich sehe, ist auf der rechten Seite einfach nichts als Schwarz, wenn ich die Anwendung ausführe.


Dies ist der Inhalt der Datei „map.html“ etwas länger.

Code: Select all

מפת רדאר






html, body, #map {
height: 100%;
margin: 0;
padding: 0;
background: black;
}





// Initialize map
var map = L.map('map', {
center: [31.5, 35.0],
zoom: 8,
zoomControl: true
});

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

// Correct radar bounds
var radarBounds = L.latLngBounds([29.0, 33.0], [33.5, 36.5]);

var radarFrames = [];
var currentLayer = null;

function loadRadarImages(list) {
radarFrames = list || [];
console.log("✅ Received " + radarFrames.length + " frames");
if (radarFrames.length > 0) showRadarFrameUri(radarFrames[0]);
}

function showRadarFrameUri(uri) {
if (currentLayer) map.removeLayer(currentLayer);
console.log("🛰 Showing " + uri);
currentLayer = L.imageOverlay(uri, radarBounds, { opacity: 0.6 }).addTo(map);
}

console.log("✅ Map initialized and ready.");

Ich erhalte keine Fehlermeldungen, nur einen schwarzen Bildschirm auf der linken Seite.