AzureMapsControl.Components
1.16.1
See the version list below for details.
dotnet add package AzureMapsControl.Components --version 1.16.1
NuGet\Install-Package AzureMapsControl.Components -Version 1.16.1
<PackageReference Include="AzureMapsControl.Components" Version="1.16.1" />
<PackageVersion Include="AzureMapsControl.Components" Version="1.16.1" />
<PackageReference Include="AzureMapsControl.Components" />
paket add AzureMapsControl.Components --version 1.16.1
#r "nuget: AzureMapsControl.Components, 1.16.1"
#addin nuget:?package=AzureMapsControl.Components&version=1.16.1
#tool nuget:?package=AzureMapsControl.Components&version=1.16.1
This library allows you to use Azure Maps
inside your razor application.
Install the Nuget Package
This library is available on Nuget as AzureMapsControl.Components
.
Setup
Add the css and scripts
You will need to add the atlas script and css files as well as the script generated by the library on your application.
<link href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css" rel="stylesheet" />
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
<script src="_content/AzureMapsControl.Components/azure-maps-control.js"></script>
Or use the minimized version :
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
<script src="_content/AzureMapsControl.Components/azure-maps-control.min.js"></script>
Register the Components
You will need to pass the authentication information of your AzureMaps
instance to the library. SubscriptionKey
, Aad
and Anonymous
authentication are supported. You will need to call the AddAzureMapsControl
method on your services.
You can authenticate using a subscription key
:
// This method gets called by the runtime. Use this method to add services to the container.
// For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
public void ConfigureServices(IServiceCollection services)
{
services.AddRazorPages();
services.AddServerSideBlazor();
services.AddAzureMapsControl(configuration => configuration.SubscriptionKey = "Your Subscription Key");
}
Or using Azure Active Directory
:
public void ConfigureServices(IServiceCollection services)
{
services.AddRazorPages();
services.AddServerSideBlazor(options => options.DetailedErrors = true);
services.AddAzureMapsControl(configuration => {
configuration.AadAppId = "Your Aad App Id";
configuration.AadTenant = "Your Aad Tenant";
configuration.ClientId = "Your Client Id";
});
}
The Anonymous
authentication requires only a ClientId
:
public void ConfigureServices(IServiceCollection services)
{
services.AddRazorPages();
services.AddServerSideBlazor(options => options.DetailedErrors = true);
services.AddAzureMapsControl(configuration => configuration.ClientId = Configuration["AzureMaps:ClientId"])
}
It also needs to fetch the token to send to the requests of the atlas library. For that, you have to override the azureMapsControl.Extensions.getTokenCallback
method on your application after referencing azure-maps-control.min.js
and resolve the token in it. For example :
@page "/"
@namespace AzureMapsControl.Sample.Pages
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>AzureMapsControl.Sample</title>
<base href="~/" />
<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css" type="text/css" />
<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/drawing/0.1/atlas-drawing.min.css" type="text/css" />
<style>
body {
margin: 0;
}
#map {
position: absolute;
width: 100%;
min-width: 290px;
height: 100%;
}
</style>
</head>
<body>
<app>
<component type="typeof(App)" render-mode="ServerPrerendered" />
</app>
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
<script src="https://atlas.microsoft.com/sdk/javascript/drawing/0.1/atlas-drawing.min.js"></script>
<script src="_content/AzureMapsControl.Components/azure-maps-control.min.js"></script>
<script src="_framework/blazor.server.js"></script>
<script type="text/javascript">
azureMapsControl.Extensions.getTokenCallback = (resolve, reject, map) => {
const url = "url_of_my_token_endpoint";
fetch(url).then(function (response) {
return response.text();
}).then(function (token) {
resolve(token);
});
};
</script>
</body>
</html>
How to use
- Map
- Controls
- Drawing Toolbar
- Html Markers
- Layers
- Sources
- Popups
- Traffic
- Expressions
- Animations
- Indoor Module
Community links
Want to contribute ?
Contributions are welcome! One of the best way to start is to take a look at the list of issues where help is wanted.
If you need a new feature which is not listed on the issues, feel free to open a new one. Take also a look at the Contributing guidelines.
Product | Versions Compatible and additional computed target framework versions. |
---|---|
.NET | net6.0 is compatible. net6.0-android was computed. net6.0-ios was computed. net6.0-maccatalyst was computed. net6.0-macos was computed. net6.0-tvos was computed. net6.0-windows was computed. net7.0 is compatible. net7.0-android was computed. net7.0-ios was computed. net7.0-maccatalyst was computed. net7.0-macos was computed. net7.0-tvos was computed. net7.0-windows was computed. net8.0 is compatible. net8.0-android was computed. net8.0-browser was computed. net8.0-ios was computed. net8.0-maccatalyst was computed. net8.0-macos was computed. net8.0-tvos was computed. net8.0-windows was computed. net9.0 was computed. net9.0-android was computed. net9.0-browser was computed. net9.0-ios was computed. net9.0-maccatalyst was computed. net9.0-macos was computed. net9.0-tvos was computed. net9.0-windows was computed. net10.0 was computed. net10.0-android was computed. net10.0-browser was computed. net10.0-ios was computed. net10.0-maccatalyst was computed. net10.0-macos was computed. net10.0-tvos was computed. net10.0-windows was computed. |
-
net6.0
- Microsoft.AspNetCore.Components.Web (>= 6.0.25)
- Microsoft.Extensions.Configuration.Abstractions (>= 6.0.0)
-
net7.0
- Microsoft.AspNetCore.Components.Web (>= 7.0.14)
- Microsoft.Extensions.Configuration.Abstractions (>= 7.0.0)
-
net8.0
- Microsoft.AspNetCore.Components.Web (>= 8.0.0)
- Microsoft.Extensions.Configuration.Abstractions (>= 8.0.0)
NuGet packages
This package is not used by any NuGet packages.
GitHub repositories
This package is not used by any popular GitHub repositories.
Version | Downloads | Last updated |
---|---|---|
2.0.0-net9.10 | 177 | 12/19/2024 |
2.0.0-net9.9 | 54 | 12/19/2024 |
2.0.0-net9.8 | 54 | 12/19/2024 |
2.0.0-net9.7 | 52 | 12/19/2024 |
2.0.0-net9.6 | 54 | 12/18/2024 |
2.0.0-net9.5 | 52 | 12/18/2024 |
2.0.0-net9.4 | 51 | 12/18/2024 |
2.0.0-net9.3 | 50 | 12/18/2024 |
2.0.0-net9.2 | 69 | 12/18/2024 |
1.16.1 | 20,825 | 6/18/2024 |
1.16.0 | 170 | 6/14/2024 |
1.16.0-alpha0003 | 109 | 6/14/2024 |
1.16.0-alpha0001 | 348 | 3/27/2024 |
1.15.0 | 6,375 | 3/12/2024 |
1.15.0-alpha0002 | 107 | 3/12/2024 |
1.14.1 | 467 | 2/28/2024 |
1.14.0 | 1,038 | 12/22/2023 |
1.14.0-alpha0015 | 125 | 12/22/2023 |
1.13.0 | 25,851 | 9/14/2022 |
1.13.0-alpha0001 | 271 | 9/13/2022 |
1.12.0 | 3,163 | 8/3/2022 |
1.12.0-alpha0038 | 191 | 8/3/2022 |
1.12.0-alpha0028 | 231 | 7/8/2022 |
1.12.0-alpha0019 | 181 | 7/7/2022 |
1.12.0-alpha0011 | 187 | 6/14/2022 |
1.12.0-alpha0004 | 266 | 2/2/2022 |
1.12.0-alpha0003 | 213 | 2/2/2022 |
1.11.0 | 9,150 | 11/12/2021 |
1.11.0-alpha0015 | 258 | 11/12/2021 |
1.10.0 | 403 | 11/8/2021 |
1.10.0-net60-alpha0001 | 203 | 10/19/2021 |
1.10.0-alpha0010 | 264 | 11/8/2021 |
1.9.0 | 1,379 | 8/4/2021 |
1.9.0-alpha0006 | 345 | 8/4/2021 |
1.8.3 | 1,052 | 7/14/2021 |
1.8.3-beta0001 | 306 | 7/14/2021 |
1.8.2 | 476 | 7/13/2021 |
1.8.2-beta0001 | 345 | 7/13/2021 |
1.8.1 | 593 | 6/25/2021 |
1.8.1-beta0001 | 351 | 6/25/2021 |
1.8.0 | 448 | 6/19/2021 |
1.8.0-html-marker-laye0001 | 319 | 6/8/2021 |
1.8.0-alpha0003 | 319 | 6/19/2021 |
1.7.1 | 560 | 6/8/2021 |
1.7.1-beta0001 | 314 | 6/3/2021 |
1.7.0 | 543 | 5/31/2021 |
1.7.0-alpha0014 | 338 | 5/31/2021 |
1.7.0-alpha0004 | 300 | 5/18/2021 |
1.7.0-alpha0001 | 308 | 5/13/2021 |
1.6.1 | 612 | 5/18/2021 |
1.6.1-beta0001 | 304 | 5/18/2021 |
1.6.0 | 494 | 5/7/2021 |
1.6.0-alpha0050 | 339 | 5/7/2021 |
1.6.0-alpha0031 | 356 | 5/7/2021 |
1.6.0-alpha0015 | 331 | 5/7/2021 |
1.5.2 | 453 | 5/6/2021 |
1.5.2-beta0001 | 349 | 5/6/2021 |
1.5.1 | 700 | 4/30/2021 |
1.5.1-beta0001 | 310 | 4/30/2021 |
1.5.0 | 464 | 4/26/2021 |
1.5.0-alpha0016 | 316 | 4/23/2021 |
1.4.0 | 434 | 4/23/2021 |
1.4.0-alpha0005 | 314 | 4/20/2021 |
1.3.0 | 487 | 4/19/2021 |
1.3.0-beta0003 | 340 | 4/17/2021 |
1.3.0-beta0002 | 320 | 4/17/2021 |
1.3.0-beta0001 | 334 | 4/17/2021 |
1.3.0-alpha0001 | 309 | 4/16/2021 |
1.2.0 | 421 | 4/15/2021 |
1.2.0-alpha0004 | 292 | 4/15/2021 |
1.1.0 | 480 | 4/13/2021 |
1.1.0-alpha0015 | 284 | 4/13/2021 |
1.0.0 | 519 | 4/9/2021 |
1.0.0-beta0008 | 322 | 3/26/2021 |
1.0.0-beta0007 | 331 | 3/24/2021 |
1.0.0-beta0006 | 338 | 3/23/2021 |
1.0.0-beta0005 | 338 | 3/22/2021 |
1.0.0-beta0004 | 328 | 3/19/2021 |
1.0.0-beta0003 | 329 | 3/19/2021 |
1.0.0-beta0002 | 331 | 3/19/2021 |
1.0.0-beta0001 | 316 | 3/19/2021 |
0.17.1 | 417 | 4/6/2021 |
0.17.1-beta0001 | 298 | 4/5/2021 |
0.17.0 | 483 | 3/24/2021 |
0.16.0 | 449 | 3/23/2021 |
0.15.0 | 656 | 3/8/2021 |
0.15.0-alpha0038 | 344 | 3/8/2021 |
0.14.0 | 462 | 3/5/2021 |
0.14.0-alpha0003 | 300 | 3/5/2021 |
0.13.0 | 473 | 3/3/2021 |
0.13.0-alpha0001 | 312 | 3/3/2021 |
0.12.0 | 548 | 2/18/2021 |
0.12.0-typescript0001 | 326 | 2/18/2021 |
0.12.0-publish-typescri0001 | 330 | 2/18/2021 |
0.12.0-alpha0018 | 303 | 2/18/2021 |
0.11.0 | 459 | 2/17/2021 |
0.11.0-alpha0003 | 296 | 2/17/2021 |
0.10.1 | 464 | 2/15/2021 |
0.10.0 | 429 | 2/15/2021 |
0.10.0-alpha0011 | 287 | 2/15/2021 |
0.10.0-alpha0005 | 300 | 2/15/2021 |
0.9.0 | 495 | 1/24/2021 |
0.9.0-alpha0013 | 394 | 1/24/2021 |
0.9.0-alpha0006 | 362 | 1/3/2021 |
0.9.0-alpha0003 | 352 | 12/8/2020 |
0.8.1 | 506 | 1/3/2021 |
0.8.0 | 586 | 12/8/2020 |
0.8.0-beta0001 | 327 | 12/8/2020 |
0.8.0-alpha0005 | 368 | 11/25/2020 |
0.7.1 | 519 | 11/25/2020 |
0.7.0 | 503 | 11/25/2020 |
0.7.0-beta0001 | 371 | 11/25/2020 |
0.7.0-alpha0002 | 357 | 11/24/2020 |
0.6.0-beta0001 | 384 | 11/24/2020 |
0.6.0-alpha0005 | 369 | 11/24/2020 |
0.6.0-alpha0001 | 355 | 11/23/2020 |
0.5.2 | 1,741 | 11/24/2020 |
0.5.1 | 495 | 11/23/2020 |
0.5.0 | 480 | 11/19/2020 |
0.4.0 | 488 | 11/12/2020 |
0.3.0-beta0001 | 391 | 11/12/2020 |
0.3.0-alpha0019 | 329 | 11/19/2020 |
0.3.0-alpha0010 | 370 | 11/12/2020 |
0.3.0-alpha0004 | 388 | 11/12/2020 |
0.2.0 | 490 | 11/12/2020 |
0.2.0-beta0003 | 431 | 11/12/2020 |
0.2.0-beta0002 | 392 | 11/12/2020 |
0.2.0-beta0001 | 376 | 11/11/2020 |
0.1.0 | 566 | 11/11/2020 |
0.1.0-beta0002 | 394 | 11/11/2020 |
0.1.0-beta0001 | 386 | 11/11/2020 |
0.1.0-alpha0236 | 414 | 11/11/2020 |
0.1.0-alpha0116 | 373 | 11/11/2020 |
0.1.0-alpha0112 | 391 | 11/11/2020 |
0.1.0-alpha0097 | 391 | 11/11/2020 |
0.1.0-alpha0091 | 403 | 11/11/2020 |
0.1.0-alpha0090 | 400 | 11/10/2020 |
0.1.0-alpha0089 | 399 | 11/10/2020 |
0.1.0-alpha0088 | 417 | 11/10/2020 |
0.1.0-alpha0087 | 415 | 11/10/2020 |
0.1.0-alpha0086 | 404 | 11/10/2020 |
0.1.0-alpha0085 | 420 | 11/10/2020 |
0.1.0-alpha0084 | 401 | 11/10/2020 |
0.1.0-alpha0083 | 397 | 11/10/2020 |
0.1.0-alpha0082 | 450 | 11/9/2020 |
0.1.0-alpha0081 | 460 | 11/9/2020 |
0.1.0-alpha0080 | 453 | 11/9/2020 |
0.1.0-alpha0079 | 415 | 11/7/2020 |
0.1.0-alpha0077 | 600 | 11/6/2020 |
0.1.0-alpha0076 | 568 | 11/6/2020 |
0.1.0-alpha0074 | 483 | 11/6/2020 |
0.1.0-alpha0071 | 426 | 11/6/2020 |
0.0.1-ci-20201106.2 | 333 | 11/6/2020 |
0.0.1-ci-20201106.1 | 293 | 11/6/2020 |
0.0.1-ci-20201105.7 | 335 | 11/5/2020 |
0.0.1-ci-20201105.6 | 347 | 11/5/2020 |
0.0.1-ci-20201105.5 | 351 | 11/5/2020 |
0.0.1-ci-20201105.4 | 343 | 11/5/2020 |
0.0.1-ci-20201105.3 | 289 | 11/5/2020 |
0.0.1-ci-20201105.2 | 299 | 11/5/2020 |
0.0.1-ci-20201105.1 | 283 | 11/5/2020 |
0.0.1-ci-20201104.2 | 297 | 11/4/2020 |
0.0.1-ci-20201104.1 | 307 | 11/4/2020 |
0.0.1-ci-20201030.5 | 300 | 10/30/2020 |
0.0.1-ci-20201030.4 | 308 | 10/30/2020 |
0.0.1-ci-20201030.3 | 322 | 10/30/2020 |
0.0.1-ci-20201030.2 | 306 | 10/30/2020 |
0.0.1-ci-20201030.1 | 288 | 10/30/2020 |
0.0.1-ci-20201029.3 | 297 | 10/29/2020 |
0.0.1-ci-20201029.2 | 313 | 10/29/2020 |
0.0.1-ci-20201029.1 | 299 | 10/29/2020 |
0.0.1-ci-20201028.1 | 283 | 10/28/2020 |
0.0.1-ci-20201027.1 | 300 | 10/27/2020 |
0.0.1-ci-20201026.2 | 331 | 10/26/2020 |
0.0.1-ci-20201026.1 | 277 | 10/26/2020 |
0.0.1-ci-20201023.2 | 333 | 10/23/2020 |
0.0.1-ci-20201023.1 | 304 | 10/23/2020 |
0.0.1-ci-20201022.1 | 299 | 10/22/2020 |
0.0.1-ci-20201008.1 | 287 | 10/8/2020 |
0.0.1-ci-20201005.1 | 338 | 10/5/2020 |
0.0.1-ci-20200407.1 | 342 | 4/7/2020 |
0.0.1-ci-20200406.3 | 345 | 4/6/2020 |
0.0.1-ci-20200406.2 | 354 | 4/6/2020 |
0.0.1-ci-20200406.1 | 358 | 4/6/2020 |
0.0.1-ci-20200403.5 | 342 | 4/3/2020 |
0.0.1-ci-20200403.4 | 358 | 4/3/2020 |
0.0.1-ci-20200403.3 | 360 | 4/3/2020 |
0.0.1-ci-20200403.2 | 347 | 4/3/2020 |
0.0.1-ci-20200403.1 | 348 | 4/3/2020 |
0.0.1-ci-20200402.2 | 351 | 4/2/2020 |
0.0.1-ci-20200402.1 | 380 | 4/2/2020 |