AzureMapsControl.Components 1.16.1

There is a newer prerelease version of this package available.
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
                    
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package.
<PackageReference Include="AzureMapsControl.Components" Version="1.16.1" />
                    
For projects that support PackageReference, copy this XML node into the project file to reference the package.
<PackageVersion Include="AzureMapsControl.Components" Version="1.16.1" />
                    
Directory.Packages.props
<PackageReference Include="AzureMapsControl.Components" />
                    
Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package.
paket add AzureMapsControl.Components --version 1.16.1
                    
#r "nuget: AzureMapsControl.Components, 1.16.1"
                    
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package.
#:package AzureMapsControl.Components@1.16.1
                    
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package.
#addin nuget:?package=AzureMapsControl.Components&version=1.16.1
                    
Install as a Cake Addin
#tool nuget:?package=AzureMapsControl.Components&version=1.16.1
                    
Install as a Cake Tool

Nuget Nuget (with prereleases) Build Unit Test release codecov Slack

This library allows you to use Azure Maps inside your razor application.

Custom Azure Map

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

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 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. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

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 201 12/19/2024
2.0.0-net9.9 56 12/19/2024
2.0.0-net9.8 58 12/19/2024
2.0.0-net9.7 62 12/19/2024
2.0.0-net9.6 58 12/18/2024
2.0.0-net9.5 58 12/18/2024
2.0.0-net9.4 59 12/18/2024
2.0.0-net9.3 59 12/18/2024
2.0.0-net9.2 76 12/18/2024
1.16.1 25,846 6/18/2024
1.16.0 293 6/14/2024
1.16.0-alpha0003 123 6/14/2024
1.16.0-alpha0001 376 3/27/2024
1.15.0 6,615 3/12/2024
1.15.0-alpha0002 120 3/12/2024
1.14.1 498 2/28/2024
1.14.0 1,056 12/22/2023
1.14.0-alpha0015 137 12/22/2023
1.13.0 26,292 9/14/2022
1.13.0-alpha0001 307 9/13/2022
1.12.0 3,203 8/3/2022
1.12.0-alpha0038 232 8/3/2022
1.12.0-alpha0028 278 7/8/2022
1.12.0-alpha0019 226 7/7/2022
1.12.0-alpha0011 245 6/14/2022
1.12.0-alpha0004 318 2/2/2022
1.12.0-alpha0003 270 2/2/2022
1.11.0 9,370 11/12/2021
1.11.0-alpha0015 311 11/12/2021
1.10.0 448 11/8/2021
1.10.0-net60-alpha0001 250 10/19/2021
1.10.0-alpha0010 308 11/8/2021
1.9.0 1,431 8/4/2021
1.9.0-alpha0006 391 8/4/2021
1.8.3 1,096 7/14/2021
1.8.3-beta0001 349 7/14/2021
1.8.2 521 7/13/2021
1.8.2-beta0001 387 7/13/2021
1.8.1 640 6/25/2021
1.8.1-beta0001 396 6/25/2021
1.8.0 496 6/19/2021
1.8.0-html-marker-laye0001 367 6/8/2021
1.8.0-alpha0003 372 6/19/2021
1.7.1 620 6/8/2021
1.7.1-beta0001 362 6/3/2021
1.7.0 586 5/31/2021
1.7.0-alpha0014 386 5/31/2021
1.7.0-alpha0004 345 5/18/2021
1.7.0-alpha0001 352 5/13/2021
1.6.1 661 5/18/2021
1.6.1-beta0001 349 5/18/2021
1.6.0 540 5/7/2021
1.6.0-alpha0050 395 5/7/2021
1.6.0-alpha0031 401 5/7/2021
1.6.0-alpha0015 377 5/7/2021
1.5.2 499 5/6/2021
1.5.2-beta0001 395 5/6/2021
1.5.1 744 4/30/2021
1.5.1-beta0001 354 4/30/2021
1.5.0 513 4/26/2021
1.5.0-alpha0016 365 4/23/2021
1.4.0 482 4/23/2021
1.4.0-alpha0005 364 4/20/2021
1.3.0 543 4/19/2021
1.3.0-beta0003 400 4/17/2021
1.3.0-beta0002 366 4/17/2021
1.3.0-beta0001 377 4/17/2021
1.3.0-alpha0001 356 4/16/2021
1.2.0 470 4/15/2021
1.2.0-alpha0004 338 4/15/2021
1.1.0 543 4/13/2021
1.1.0-alpha0015 329 4/13/2021
1.0.0 570 4/9/2021
1.0.0-beta0008 368 3/26/2021
1.0.0-beta0007 375 3/24/2021
1.0.0-beta0006 386 3/23/2021
1.0.0-beta0005 383 3/22/2021
1.0.0-beta0004 390 3/19/2021
1.0.0-beta0003 379 3/19/2021
1.0.0-beta0002 377 3/19/2021
1.0.0-beta0001 362 3/19/2021
0.17.1 464 4/6/2021
0.17.1-beta0001 342 4/5/2021
0.17.0 527 3/24/2021
0.16.0 504 3/23/2021
0.15.0 706 3/8/2021
0.15.0-alpha0038 392 3/8/2021
0.14.0 511 3/5/2021
0.14.0-alpha0003 348 3/5/2021
0.13.0 523 3/3/2021
0.13.0-alpha0001 373 3/3/2021
0.12.0 598 2/18/2021
0.12.0-typescript0001 375 2/18/2021
0.12.0-publish-typescri0001 376 2/18/2021
0.12.0-alpha0018 363 2/18/2021
0.11.0 505 2/17/2021
0.11.0-alpha0003 342 2/17/2021
0.10.1 515 2/15/2021
0.10.0 476 2/15/2021
0.10.0-alpha0011 335 2/15/2021
0.10.0-alpha0005 345 2/15/2021
0.9.0 546 1/24/2021
0.9.0-alpha0013 442 1/24/2021
0.9.0-alpha0006 424 1/3/2021
0.9.0-alpha0003 402 12/8/2020
0.8.1 557 1/3/2021
0.8.0 636 12/8/2020
0.8.0-beta0001 378 12/8/2020
0.8.0-alpha0005 416 11/25/2020
0.7.1 572 11/25/2020
0.7.0 567 11/25/2020
0.7.0-beta0001 422 11/25/2020
0.7.0-alpha0002 406 11/24/2020
0.6.0-beta0001 433 11/24/2020
0.6.0-alpha0005 424 11/24/2020
0.6.0-alpha0001 406 11/23/2020
0.5.2 1,796 11/24/2020
0.5.1 544 11/23/2020
0.5.0 531 11/19/2020
0.4.0 544 11/12/2020
0.3.0-beta0001 447 11/12/2020
0.3.0-alpha0019 380 11/19/2020
0.3.0-alpha0010 418 11/12/2020
0.3.0-alpha0004 444 11/12/2020
0.2.0 543 11/12/2020
0.2.0-beta0003 483 11/12/2020
0.2.0-beta0002 452 11/12/2020
0.2.0-beta0001 428 11/11/2020
0.1.0 619 11/11/2020
0.1.0-beta0002 443 11/11/2020
0.1.0-beta0001 436 11/11/2020
0.1.0-alpha0236 468 11/11/2020
0.1.0-alpha0116 425 11/11/2020
0.1.0-alpha0112 441 11/11/2020
0.1.0-alpha0097 441 11/11/2020
0.1.0-alpha0091 458 11/11/2020
0.1.0-alpha0090 466 11/10/2020
0.1.0-alpha0089 452 11/10/2020
0.1.0-alpha0088 472 11/10/2020
0.1.0-alpha0087 467 11/10/2020
0.1.0-alpha0086 457 11/10/2020
0.1.0-alpha0085 473 11/10/2020
0.1.0-alpha0084 462 11/10/2020
0.1.0-alpha0083 448 11/10/2020
0.1.0-alpha0082 503 11/9/2020
0.1.0-alpha0081 510 11/9/2020
0.1.0-alpha0080 501 11/9/2020
0.1.0-alpha0079 465 11/7/2020
0.1.0-alpha0077 665 11/6/2020
0.1.0-alpha0076 621 11/6/2020
0.1.0-alpha0074 533 11/6/2020
0.1.0-alpha0071 475 11/6/2020
0.0.1-ci-20201106.2 394 11/6/2020
0.0.1-ci-20201106.1 344 11/6/2020
0.0.1-ci-20201105.7 386 11/5/2020
0.0.1-ci-20201105.6 395 11/5/2020
0.0.1-ci-20201105.5 401 11/5/2020
0.0.1-ci-20201105.4 392 11/5/2020
0.0.1-ci-20201105.3 351 11/5/2020
0.0.1-ci-20201105.2 350 11/5/2020
0.0.1-ci-20201105.1 336 11/5/2020
0.0.1-ci-20201104.2 346 11/4/2020
0.0.1-ci-20201104.1 356 11/4/2020
0.0.1-ci-20201030.5 348 10/30/2020
0.0.1-ci-20201030.4 360 10/30/2020
0.0.1-ci-20201030.3 371 10/30/2020
0.0.1-ci-20201030.2 370 10/30/2020
0.0.1-ci-20201030.1 350 10/30/2020
0.0.1-ci-20201029.3 349 10/29/2020
0.0.1-ci-20201029.2 373 10/29/2020
0.0.1-ci-20201029.1 350 10/29/2020
0.0.1-ci-20201028.1 333 10/28/2020
0.0.1-ci-20201027.1 351 10/27/2020
0.0.1-ci-20201026.2 379 10/26/2020
0.0.1-ci-20201026.1 326 10/26/2020
0.0.1-ci-20201023.2 383 10/23/2020
0.0.1-ci-20201023.1 353 10/23/2020
0.0.1-ci-20201022.1 350 10/22/2020
0.0.1-ci-20201008.1 339 10/8/2020
0.0.1-ci-20201005.1 399 10/5/2020
0.0.1-ci-20200407.1 404 4/7/2020
0.0.1-ci-20200406.3 405 4/6/2020
0.0.1-ci-20200406.2 407 4/6/2020
0.0.1-ci-20200406.1 408 4/6/2020
0.0.1-ci-20200403.5 411 4/3/2020
0.0.1-ci-20200403.4 409 4/3/2020
0.0.1-ci-20200403.3 412 4/3/2020
0.0.1-ci-20200403.2 399 4/3/2020
0.0.1-ci-20200403.1 412 4/3/2020
0.0.1-ci-20200402.2 405 4/2/2020
0.0.1-ci-20200402.1 431 4/2/2020