如何在运行时更改 BlazorGoogleMaps 库中的 MapOptions？

Question

我正在使用 BlazorGoogleMaps NuGet 包。 您可以在以下位置查看源代码：GitHub

我希望能够在执行过程中将 MapType 更改为 Satellite 和 RoadMap。

以下代码没有影响。

_mapOptions.MapTypeId = MapTypeId.Satellite;
_map1.Options = _mapOptions;
//give the UI Access
await InvokeAsync(StateHasChanged);

我将此代码包含在 MapRoutes.razor.cs => AddDirections() 方法中。

谢谢你

private async Task AddDirections()
{
    _durationTotalString = null;
    _distanceTotalString = null;
    if (await _dirRend.GetMap() is null)
    {
        await _dirRend.SetMap(_map1!.InteropObject);
    }

    _mapOptions.MapTypeId = MapTypeId.Satellite;
    _map1.Options = _mapOptions;
    //give the UI Access
    await InvokeAsync(StateHasChanged);

    //Adding a waypoint
    var waypoints = new List<DirectionsWaypoint>();
    waypoints.Add(new DirectionsWaypoint() { Location = "Bethlehem, PA", Stopover = true });

    //Direction Request
    var dr = new DirectionsRequest();
    dr.Origin = "Allentown, PA";
    dr.Destination = "Bronx, NY";
    dr.Waypoints = waypoints;
    dr.TravelMode = TravelMode.Driving;
    dr.DrivingOptions = new DrivingOptions()
    {
        DepartureTime = DateTime.Now.AddHours(1)
    };

    //Calculate Route
    _directionsResult = await _dirRend.Route(dr, new DirectionsRequestOptions
    {
        StripLegsStepsLatLngs = false,
        StripOverviewPath = false,
        StripOverviewPolyline = false,
        StripLegsStepsPath = false,
        StripLegsSteps = false
    });

    if (_directionsResult is null)
    {
        return;
    }
    var routes = _directionsResult.Routes.SelectMany(x => x.Legs).ToList();

    foreach (var route in routes)
    {
        _durationTotalString += route.DurationInTraffic?.Text;
        _distanceTotalString += route.Distance.Text;
    }
}

Answer 1

有完整的服务器端演示页面显示功能。还有更多演示页面。 https://github.com/rungwiroon/BlazorGoogleMaps/blob/master/ServerSideDemo/Pages/Maps.razor#L114

private async Task ToggleMapType()
    {
        var mapTypeId = await _map1.GetMapTypeId();

        Console.WriteLine($"Map type is {mapTypeId}");

        if (mapTypeId != MapTypeId.Satellite)
        {
            await _map1.SetMapTypeId(MapTypeId.Satellite);
        }
        else
        {
            await _map1.SetMapTypeId(MapTypeId.Roadmap);
        }
    }