小编Nak*_*i49的帖子

是否可以在 Blazor 中使用 Bing 或 Google Maps API?

我正在尝试启动并运行地图 API,并努力使 Blazor 与 Js 函数配合使用。有没有人有 Bing 或 Google 地图在 Blazor 中工作的例子,我可以看看?

我已经尝试使用 Microsoft 的 Blazor JSInterop 文档中描述的方法引用存储在 wwwroot.index.html 文件中的脚本,但大多都失败了。

索引.html:

<body>
    <app>Loading...</app>
    <script type='text/javascript'>
        function loadMapScenario() {
            var map = new Microsoft.Maps.Map(document.getElementById('myMap'), {});
            var pushpin = new Microsoft.Maps.Pushpin(map.getCenter(), null);
            map.entities.push(pushpin);
            return "";
        }
    </script>
    <script type='text/javascript' src='https://www.bing.com/api/maps/mapcontrol?key=###&callback=loadMapScenario' async defer></script>
    <script src="_framework/blazor.webassembly.js"></script>
</body>
Run Code Online (Sandbox Code Playgroud)

blazor 页面:

@page "/"
@inject IJSRuntime JSRuntime

<h1>Hello, world!</h1>

Welcome to your new app.

<div id='myMap' style='width: 400px; height: 300px;'></div>

@functions {
    protected override async Task OnInitAsync() …
Run Code Online (Sandbox Code Playgroud)

blazor

6
推荐指数
1
解决办法
2422
查看次数

标签 统计

blazor ×1