Map

TsgcHTMLComponent_Map — renderizza una mappa interattiva Leaflet.js con tile OpenStreetMap o CartoDB e i tuoi marcatori, popup e tooltip, in Delphi, C++ Builder e .NET.

In sintesi

TsgcHTMLComponent_Map

Un componente di mappatura che emette un contenitore di mappa Leaflet.js più lo script che lo inizializza. Imposta il centro, lo zoom e il provider di tile, aggiungi i marcatori, quindi leggi la proprietà HTML.

Classe del componente

TsgcHTMLComponent_Map

Renderizza

Leaflet.js map + tile layer

Famiglia

Grafici e Visualizzazione

Linguaggi

Delphi, C++ Builder, .NET

QuickStart

Centrala, aggiungi i marcatori, renderizzala

Imposta CenterLatitude, CenterLongitude e Zoom, scegli il TileProvider, chiama AddMarker per ogni punto, quindi leggi HTML.

uses
  sgcHTML_Enums, sgcHTML_Component_Map;

var
  oMap: TsgcHTMLComponent_Map;
begin
  oMap := TsgcHTMLComponent_Map.Create(nil);
  try
    oMap.CenterLatitude := 40.4168;
    oMap.CenterLongitude := -3.7038;
    oMap.Zoom := 12;
    oMap.Height := '420px';
    oMap.TileProvider := mtCartoDB;

    oMap.AddMarker(40.4168, -3.7038, 'Madrid', 'Head office');
    oMap.AddMarker(41.3851, 2.1734, 'Barcelona');

    WebModule.Response := oMap.HTML;   // Leaflet map + markers
  finally
    oMap.Free;
  end;
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Map.hpp

TsgcHTMLComponent_Map *oMap = new TsgcHTMLComponent_Map(NULL);
try
{
  oMap->CenterLatitude = 40.4168;
  oMap->CenterLongitude = -3.7038;
  oMap->Zoom = 12;
  oMap->Height = "420px";
  oMap->TileProvider = mtCartoDB;

  oMap->AddMarker(40.4168, -3.7038, "Madrid", "Head office");
  oMap->AddMarker(41.3851, 2.1734, "Barcelona");

  String html = oMap->HTML;   // Leaflet map + markers
}
__finally
{
  delete oMap;
}

using esegece.sgcWebSockets;

var map = new TsgcHTMLComponent_Map();
map.CenterLatitude = 40.4168;
map.CenterLongitude = -3.7038;
map.Zoom = 12;
map.Height = "420px";
map.TileProvider = TsgcHTMLMapTileProvider.mtCartoDB;

map.AddMarker(40.4168, -3.7038, "Madrid", "Head office");
map.AddMarker(41.3851, 2.1734, "Barcelona");

string html = map.HTML;   // Leaflet map + markers

Riferimento

Proprietà e metodi principali

I membri che utilizzerai più spesso.

Centro e zoom

CenterLatitude e CenterLongitude (Double) impostano la vista iniziale; Zoom (predefinito 13) imposta il livello di zoom.

Tile

TileProvider (TsgcHTMLMapTileProvider) seleziona mtOpenStreetMap, mtCartoDB (chiaro) o mtCartoDBDark.

Marcatori

Markers (TsgcHTMLMapMarkers) contiene i segnaposto; ogni TsgcHTMLMapMarker ha Latitude, Longitude, PopupText, TooltipText e Color.

Aggiungere un marcatore

AddMarker(aLat, aLng, aPopup, aTooltip) inserisce un segnaposto; il popup si apre al clic e il tooltip compare al passaggio del mouse.

Dimensionamento

Height (una lunghezza CSS come '420px') controlla l’altezza della mappa; MapID imposta l’id dell’elemento contenitore.

Output

HTML restituisce il link al foglio di stile Leaflet, il <div> della mappa e lo script di inizializzazione — servilo, oppure assegnalo al BodyContent di un template di pagina.

Risorse

Continua a esplorare

	Tutti i componenti sgcHTMLEsplora la matrice completa delle funzionalità di oltre 60 componenti.	Apri
	Scarica la Prova GratuitaLa prova di 30 giorni include i progetti demo 60.HTML.	Apri
	PrezziLicenze Single, Team e Site con codice sorgente completo.	Apri

Map