AzureMapsControl.Components 1.12.0-alpha0003

This is a prerelease version of AzureMapsControl.Components.
There is a newer version of this package available.
See the version list below for details.
dotnet add package AzureMapsControl.Components --version 1.12.0-alpha0003                
NuGet\Install-Package AzureMapsControl.Components -Version 1.12.0-alpha0003                
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.12.0-alpha0003" />                
For projects that support PackageReference, copy this XML node into the project file to reference the package.
paket add AzureMapsControl.Components --version 1.12.0-alpha0003                
#r "nuget: AzureMapsControl.Components, 1.12.0-alpha0003"                
#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.
// Install AzureMapsControl.Components as a Cake Addin
#addin nuget:?package=AzureMapsControl.Components&version=1.12.0-alpha0003&prerelease

// Install AzureMapsControl.Components as a Cake Tool
#tool nuget:?package=AzureMapsControl.Components&version=1.12.0-alpha0003&prerelease                

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 rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/atlas.min.css" type="text/css" />
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/2/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/2/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/2/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/2/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 net5.0 is compatible.  net5.0-windows was computed.  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 was computed.  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 was computed.  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. 
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
1.16.1 5,798 6/18/2024
1.16.0 151 6/14/2024
1.16.0-alpha0003 95 6/14/2024
1.16.0-alpha0001 280 3/27/2024
1.15.0 4,749 3/12/2024
1.15.0-alpha0002 95 3/12/2024
1.14.1 411 2/28/2024
1.14.0 987 12/22/2023
1.14.0-alpha0015 113 12/22/2023
1.13.0 23,523 9/14/2022
1.13.0-alpha0001 242 9/13/2022
1.12.0 3,092 8/3/2022
1.12.0-alpha0038 160 8/3/2022
1.12.0-alpha0028 199 7/8/2022
1.12.0-alpha0019 151 7/7/2022
1.12.0-alpha0011 154 6/14/2022
1.12.0-alpha0004 228 2/2/2022
1.12.0-alpha0003 169 2/2/2022
1.11.0 8,608 11/12/2021
1.11.0-alpha0015 218 11/12/2021
1.10.0 357 11/8/2021
1.10.0-net60-alpha0001 164 10/19/2021
1.10.0-alpha0010 225 11/8/2021
1.9.0 1,326 8/4/2021
1.9.0-alpha0006 305 8/4/2021
1.8.3 1,006 7/14/2021
1.8.3-beta0001 266 7/14/2021
1.8.2 432 7/13/2021
1.8.2-beta0001 305 7/13/2021
1.8.1 550 6/25/2021
1.8.1-beta0001 311 6/25/2021
1.8.0 405 6/19/2021
1.8.0-html-marker-laye0001 281 6/8/2021
1.8.0-alpha0003 282 6/19/2021
1.7.1 517 6/8/2021
1.7.1-beta0001 275 6/3/2021
1.7.0 499 5/31/2021
1.7.0-alpha0014 298 5/31/2021
1.7.0-alpha0004 261 5/18/2021
1.7.0-alpha0001 268 5/13/2021
1.6.1 561 5/18/2021
1.6.1-beta0001 265 5/18/2021
1.6.0 443 5/7/2021
1.6.0-alpha0050 296 5/7/2021
1.6.0-alpha0031 312 5/7/2021
1.6.0-alpha0015 285 5/7/2021
1.5.2 403 5/6/2021
1.5.2-beta0001 303 5/6/2021
1.5.1 651 4/30/2021
1.5.1-beta0001 265 4/30/2021
1.5.0 413 4/26/2021
1.5.0-alpha0016 273 4/23/2021
1.4.0 385 4/23/2021
1.4.0-alpha0005 269 4/20/2021
1.3.0 433 4/19/2021
1.3.0-beta0003 294 4/17/2021
1.3.0-beta0002 275 4/17/2021
1.3.0-beta0001 288 4/17/2021
1.3.0-alpha0001 263 4/16/2021
1.2.0 369 4/15/2021
1.2.0-alpha0004 247 4/15/2021
1.1.0 427 4/13/2021
1.1.0-alpha0015 238 4/13/2021
1.0.0 459 4/9/2021
1.0.0-beta0008 270 3/26/2021
1.0.0-beta0007 285 3/24/2021
1.0.0-beta0006 292 3/23/2021
1.0.0-beta0005 288 3/22/2021
1.0.0-beta0004 281 3/19/2021
1.0.0-beta0003 279 3/19/2021
1.0.0-beta0002 285 3/19/2021
1.0.0-beta0001 267 3/19/2021
0.17.1 366 4/6/2021
0.17.1-beta0001 251 4/5/2021
0.17.0 431 3/24/2021
0.16.0 399 3/23/2021
0.15.0 603 3/8/2021
0.15.0-alpha0038 296 3/8/2021
0.14.0 407 3/5/2021
0.14.0-alpha0003 251 3/5/2021
0.13.0 419 3/3/2021
0.13.0-alpha0001 263 3/3/2021
0.12.0 494 2/18/2021
0.12.0-typescript0001 277 2/18/2021
0.12.0-publish-typescri0001 281 2/18/2021
0.12.0-alpha0018 251 2/18/2021
0.11.0 403 2/17/2021
0.11.0-alpha0003 247 2/17/2021
0.10.1 410 2/15/2021
0.10.0 375 2/15/2021
0.10.0-alpha0011 238 2/15/2021
0.10.0-alpha0005 249 2/15/2021
0.9.0 442 1/24/2021
0.9.0-alpha0013 343 1/24/2021
0.9.0-alpha0006 312 1/3/2021
0.9.0-alpha0003 301 12/8/2020
0.8.1 451 1/3/2021
0.8.0 531 12/8/2020
0.8.0-beta0001 277 12/8/2020
0.8.0-alpha0005 317 11/25/2020
0.7.1 462 11/25/2020
0.7.0 447 11/25/2020
0.7.0-beta0001 320 11/25/2020
0.7.0-alpha0002 306 11/24/2020
0.6.0-beta0001 333 11/24/2020
0.6.0-alpha0005 319 11/24/2020
0.6.0-alpha0001 304 11/23/2020
0.5.2 1,677 11/24/2020
0.5.1 441 11/23/2020
0.5.0 420 11/19/2020
0.4.0 431 11/12/2020
0.3.0-beta0001 334 11/12/2020
0.3.0-alpha0019 279 11/19/2020
0.3.0-alpha0010 319 11/12/2020
0.3.0-alpha0004 337 11/12/2020
0.2.0 435 11/12/2020
0.2.0-beta0003 371 11/12/2020
0.2.0-beta0002 342 11/12/2020
0.2.0-beta0001 325 11/11/2020
0.1.0 503 11/11/2020
0.1.0-beta0002 344 11/11/2020
0.1.0-beta0001 336 11/11/2020
0.1.0-alpha0236 364 11/11/2020
0.1.0-alpha0116 326 11/11/2020
0.1.0-alpha0112 341 11/11/2020
0.1.0-alpha0097 341 11/11/2020
0.1.0-alpha0091 341 11/11/2020
0.1.0-alpha0090 350 11/10/2020
0.1.0-alpha0089 346 11/10/2020
0.1.0-alpha0088 367 11/10/2020
0.1.0-alpha0087 364 11/10/2020
0.1.0-alpha0086 356 11/10/2020
0.1.0-alpha0085 369 11/10/2020
0.1.0-alpha0084 351 11/10/2020
0.1.0-alpha0083 347 11/10/2020
0.1.0-alpha0082 402 11/9/2020
0.1.0-alpha0081 411 11/9/2020
0.1.0-alpha0080 404 11/9/2020
0.1.0-alpha0079 367 11/7/2020
0.1.0-alpha0077 550 11/6/2020
0.1.0-alpha0076 519 11/6/2020
0.1.0-alpha0074 433 11/6/2020
0.1.0-alpha0071 372 11/6/2020
0.0.1-ci-20201106.2 285 11/6/2020
0.0.1-ci-20201106.1 245 11/6/2020
0.0.1-ci-20201105.7 286 11/5/2020
0.0.1-ci-20201105.6 296 11/5/2020
0.0.1-ci-20201105.5 303 11/5/2020
0.0.1-ci-20201105.4 295 11/5/2020
0.0.1-ci-20201105.3 239 11/5/2020
0.0.1-ci-20201105.2 251 11/5/2020
0.0.1-ci-20201105.1 235 11/5/2020
0.0.1-ci-20201104.2 247 11/4/2020
0.0.1-ci-20201104.1 259 11/4/2020
0.0.1-ci-20201030.5 250 10/30/2020
0.0.1-ci-20201030.4 259 10/30/2020
0.0.1-ci-20201030.3 273 10/30/2020
0.0.1-ci-20201030.2 258 10/30/2020
0.0.1-ci-20201030.1 237 10/30/2020
0.0.1-ci-20201029.3 241 10/29/2020
0.0.1-ci-20201029.2 265 10/29/2020
0.0.1-ci-20201029.1 250 10/29/2020
0.0.1-ci-20201028.1 234 10/28/2020
0.0.1-ci-20201027.1 252 10/27/2020
0.0.1-ci-20201026.2 280 10/26/2020
0.0.1-ci-20201026.1 227 10/26/2020
0.0.1-ci-20201023.2 277 10/23/2020
0.0.1-ci-20201023.1 256 10/23/2020
0.0.1-ci-20201022.1 250 10/22/2020
0.0.1-ci-20201008.1 232 10/8/2020
0.0.1-ci-20201005.1 289 10/5/2020
0.0.1-ci-20200407.1 286 4/7/2020
0.0.1-ci-20200406.3 290 4/6/2020
0.0.1-ci-20200406.2 300 4/6/2020
0.0.1-ci-20200406.1 301 4/6/2020
0.0.1-ci-20200403.5 288 4/3/2020
0.0.1-ci-20200403.4 303 4/3/2020
0.0.1-ci-20200403.3 305 4/3/2020
0.0.1-ci-20200403.2 293 4/3/2020
0.0.1-ci-20200403.1 293 4/3/2020
0.0.1-ci-20200402.2 296 4/2/2020
0.0.1-ci-20200402.1 319 4/2/2020