La navegación en el control IgbGeographicMap está habilitada de forma predeterminada y permite hacer zoom y desplazarse por el contenido del mapa. Sin embargo, este comportamiento se puede cambiar usando la propiedad Zoomable. Es importante saber que el mapa sólo permite hacer zoom sincronizado: escalar el contenido del mapa manteniendo la relación de aspecto. Como resultado, no es posible escalar el contenido del mapa verticalmente sin escalarlo también horizontalmente y viceversa.
Blazor Navigating Map Content Example
EXAMPLE
MODULES
DATA
RAZOR
CSS
using System;
using System.Net.Http;
using System.Collections.Generic;
using System.Threading.Tasks;
using System.Text;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.DependencyInjection;
using Microsoft.Extensions.Logging;
using IgniteUI.Blazor.Controls; // for registering Ignite UI modulesnamespaceInfragistics.Samples
{
publicclassProgram
{
publicstaticasync Task Main(string[] args)
{
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("app");
builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
// registering Ignite UI modules
builder.Services.AddIgniteUIBlazor(
typeof(IgbGeographicMapModule),
typeof(IgbDataChartInteractivityModule)
);
await builder.Build().RunAsync();
}
}
}cs
using IgniteUI.Blazor.Controls;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.CompilerServices;
using System.Threading.Tasks;
namespaceInfragistics.Samples
{
publicenum MapRegion
{
Caribbean,
UnitedStates,
UnitedKingdom,
European,
SouthAfrica,
Poland,
Australia,
Japan,
Uruguay,
Egypt,
Hawaii
}
publicclassMapUtils
{
publicstatic Dictionary<MapRegion, Rect> Regions;
publicstaticvoidNavigateTo(IgbGeographicMap map, MapRegion region)
{
Rect rect = Regions[region];
map.ZoomToGeographic(rect);
}
publicstaticstringToPixel(double number)
{
string s = Math.Abs(number).ToString("N0");
return s + " px";
}
publicstaticstringToLng(double number)
{
number = Clamp(number, -180, 180);
string s = Math.Abs(number).ToString("N1");
if (number < 100)
{
s = " " + s;
}
if (number > 0)
{
return s + "°E";
}
else
{
return s + "°W";
}
}
publicstaticstringToLat(double number)
{
number = Clamp(number, -90, 90);
string s = Math.Abs(number).ToString("N1");
if(number < 100)
{
s = " " + s;
}
if (number > 0)
{
return s + "°N";
}
else
{
return s + "°S";
}
}
publicstaticdoubleClamp(double number, double min, double max)
{
return Math.Max(min, Math.Min(max, number));
}
publicstaticdoublePad(double number, double places)
{
//TODOreturn0;
}
publicstaticstringGetBingKey()
{
return"Avlo7qsH1zZZI0XNpTwZ4XwvUJmCbd-mczMeUXVAW9kYYOKdmBIVRe8aoO02Xctq";
}
publicstatic Dictionary<MapRegion, Rect> GetRegions()
{
if(Regions == null || Regions.Count == 0)
{
CreateRegions();
}
return Regions;
}
privatestaticvoidAddRegion(MapRegion name, Rect geoRect)
{
Regions.Add(name, geoRect);
}
privatestaticvoidCreateRegions()
{
Regions = new Dictionary<MapRegion, Rect>();
AddRegion(MapRegion.Australia, new Rect() { Left= 81.5, Top= -52.0, Width= 98.0, Height= 56.0 });
AddRegion(MapRegion.Caribbean, new Rect() { Left= -92.9, Top= 5.4, Width= 35.1, Height= 25.8 });
AddRegion(MapRegion.Egypt, new Rect() { Left= 19.3, Top= 19.9, Width= 19.3, Height= 13.4 });
AddRegion(MapRegion.European, new Rect() { Left= -36.0, Top= 31.0, Width= 98.0, Height= 38.0 });
AddRegion(MapRegion.Japan, new Rect() { Left= 122.7, Top= 29.4, Width= 27.5, Height= 17.0 });
AddRegion(MapRegion.Hawaii, new Rect() { Left= -161.2, Top= 18.5, Width= 6.6, Height= 4.8 });
AddRegion(MapRegion.Poland, new Rect() { Left= 13.0, Top= 48.0, Width= 11.0, Height= 9.0 });
AddRegion(MapRegion.SouthAfrica, new Rect() { Left= 9.0, Top= -37.1, Width= 26.0, Height= 17.8 });
AddRegion(MapRegion.UnitedStates, new Rect() { Left= -134.5, Top= 16.0, Width= 70.0, Height= 37.0 });
AddRegion(MapRegion.UnitedKingdom, new Rect() { Left= -15.0, Top= 49.5, Width= 22.5, Height= 8.0 });
AddRegion(MapRegion.Uruguay, new Rect() { Left= -62.1, Top= -35.7, Width= 10.6, Height= 7.0 });
}
}
}cs
Establece una nueva posición y tamaño de la ventana de navegación en el área visible del contenido del mapa. Rect con valores 0, 0, 1, 1 alejará todo el contenido del mapa en la ventana de navegación.
Establece un nuevo tamaño de la ventana de navegación en el control del mapa. Es el valor más pequeño equivalente de Ancho o Alto almacenado en elWindowRect propiedad
Establece una nueva posición horizontal del punto de anclaje de la ventana de navegación desde el borde izquierdo del control del mapa. Es equivalente al valor almacenado en la izquierda delWindowRect propiedad.
Establece una nueva posición vertical del punto de anclaje de la ventana de navegación desde el borde superior del control del mapa. Es equivalente al valor almacenado en la parte superior de laWindowRect propiedad.
Indica la posición actual y el tamaño de la ventana de navegación en el área visible del contenido del mapa. Rect con valores 0, 0, 1, 1 muestra todo el contenido del mapa en la ventana de navegación.
Indica el tamaño actual de la ventana de navegación en el control del mapa. Es equivalente al valor más pequeño de Ancho o Alto almacenado en elActualWindowRect propiedad
Indica la posición horizontal actual del punto de anclaje de la ventana de navegación desde el borde izquierdo del control del mapa. Es equivalente al valor almacenado en la izquierda delActualWindowRect propiedad.
Indica la posición vertical del punto de anclaje de la ventana de navegación desde el borde superior del control del mapa. Es equivalente al valor almacenado en la parte superior de laActualWindowRect propiedad.