Map

TsgcHTMLComponent_Map — affichez une carte interactive Leaflet.js avec des tuiles OpenStreetMap ou CartoDB et vos propres marqueurs, popups et infobulles, en Delphi, C++ Builder et .NET.

En bref

TsgcHTMLComponent_Map

Un composant cartographique qui émet un conteneur de carte Leaflet.js ainsi que le script qui l'initialise. Définissez le centre, le zoom et le fournisseur de tuiles, ajoutez des marqueurs, puis lisez la propriété HTML.

Classe du composant

TsgcHTMLComponent_Map

Produit

Carte Leaflet.js + couche de tuiles

Famille

Graphiques & Visualisation

Langages

Delphi, C++ Builder, .NET

QuickStart

Centrez-la, déposez des marqueurs, affichez-la

Définissez CenterLatitude, CenterLongitude et Zoom, choisissez le TileProvider, appelez AddMarker pour chaque point, puis lisez 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

Référence

Propriétés & méthodes clés

Les membres que vous utilisez le plus souvent.

Centre & zoom

CenterLatitude et CenterLongitude (Double) définissent la vue initiale ; Zoom (13 par défaut) définit le niveau de zoom.

Tuiles

TileProvider (TsgcHTMLMapTileProvider) sélectionne mtOpenStreetMap, mtCartoDB (clair) ou mtCartoDBDark.

Marqueurs

Markers (TsgcHTMLMapMarkers) contient les épingles ; chaque TsgcHTMLMapMarker possède Latitude, Longitude, PopupText, TooltipText et Color.

Ajouter un marqueur

AddMarker(aLat, aLng, aPopup, aTooltip) dépose une épingle ; le popup s'ouvre au clic et l'infobulle s'affiche au survol.

Dimensionnement

Height (une longueur CSS telle que '420px') contrôle la hauteur de la carte ; MapID définit l'identifiant de l'élément conteneur.

Sortie

HTML renvoie le lien de feuille de style Leaflet, le <div> de la carte et le script d'initialisation — servez-le, ou affectez-le au BodyContent d'un modèle de page.

Ressources

Continuez l'exploration

	Tous les composants sgcHTMLParcourez la matrice complète des fonctionnalités de plus de 60 composants.	Ouvrir
	Télécharger la version d'essai gratuiteLa version d'essai de 30 jours fournit les projets de démonstration 60.HTML.	Ouvrir
	TarifsLicences Single, Team et Site avec code source complet.	Ouvrir

Map