Pourquoi intégrer une carte dans une application web ?

L'intégration de fonctionnalités cartographiques dans les applications web répond à un besoin réel pour les utilisateurs. Visualiser des données géographiques permet une meilleure compréhension des processus métier. Les fournisseurs de cartes comme Gaode (AMap) offrent des SDK pour les développeurs, mais les outils Delphi traditionnels comme uniGUI ne les prennent pas en charge nativement. Le composant CCuniGUIAMap de ChinaCock comble ce manque en encapsulant le SDK Gaode dans un composant Delphi pour uniGUI.

Avantages de l'utilisation du composant

• Performence accrue : Le rendu de la carte est nettement plus rapide par rapport aux solutions basées sur des requêtes URL directes, offrant une expérience fluide.
• Contrôle étendu : Toutes les fonctionnalités du SDK Gaode deviennent accessibles via du code Delphi, sans nécessiter de connaissances approfondies en HTML/CSS/JS.
• Intégration visuelle : Le composant se comporte comme un contrôle uniGUI standard, permettant un placement et un dimensionnement intuitifs dans l'éditeur.
• Encapsulation complète : L'ensemble de l'API est exposé via des propriétés et méthodes Delphi, simplifiant le développement et tirant parti de l'expérience Delphi.
• Personnalisation avancée : Pour les développeurs familiers avec le web, des événements personnalisés comme CustomClientEvents permettent d'étendre les fonctionnalités en manipulant directement le JavaScript sous-jacent.

Mise en œuvre pas à pas

1. Création du conteneur

Commencez par créer un uniForm ou un uniFrame dans votre projet uniGUI. Ce conteneur accueillira le contrôle cartographique.

2. Ajout du contrôle de carte

Glissez-déposez le contrôle TCCuniGUIAMap sur le formulaire. Il apparaît comme un composant visuel dont vous pouvez configurer l'alignement, les marges et les propriétés de mise en page comme tout autre contrôle uniGUI.

3. Initialisation de la carte

Dans l'événement OnCreate du formulaire, initialisez les options de base de la carte. Voici un exemple modifié utilisant des noms de variables et des valeurs différents pour illustrer la flexibilité :

procedure TMainForm.UniFormCreate(Sender: TObject);
var
  mapOpts: TCCuniGUIAMapOptions;
begin
  mapOpts := AMapViewer.Options;
  mapOpts.DisableDoubleClickZoom := True;
  mapOpts.InitialZoomLevel := 8;

  // Définition du centre géographique sur une autre région
  mapOpts.DefaultCenter.Longitude := 2.3522;
  mapOpts.DefaultCenter.Latitude := 48.8566;

  mapOpts.DisplayMode := dm3D;
  mapOpts.ZoomRange.SetRange(3, 18);
end;

Cet exemple initialise une carte 3D centrée sur Paris avec des paramètres de zoom spécifiques. Le code reste entièrement en Delphi, préservant la cohérence de développement.

4. Ajout d'éléments post-chargement

Certains contrôles de carte nécessitent d'être ajoutés après le chargement initial. Utilisez l'événement OnMapReady pour ces opérations. L'exemple ci-dessous intègre une barre d'outils et un contrôle de navigation :

procedure TMainForm.AMapViewerMapReady(Sender: TObject);
begin
  // Activation de la barre d'outils de navigation
  AMapViewer.NavigationControl.Enable;
  AMapViewer.NavigationControl.SetPosition(ncTopRight);

  // Ajout d'un contrôle d'échelle
  AMapViewer.ScaleControl.Show;
end;

Cette approche garantit que les composants de l'interface cartographique sont correctement initialisés une fois la carte prête.

5. Configuraton de l'authentification

Pour fonctionner, la carte nécessite une clé d'API Gaode. Récupérez-la sur le portail officiel des développeurs Gaode. Ensuite, placez un contrôle TCCuniGUIAMapKeys dans le module principle (uniMainModule) et configurez-le ainsi :

procedure TAppMainModule.UniGUIMainModuleCreate(Sender: TObject);
begin
  // Remplacez les chaînes par vos clés réelles
  MapApiKeys.ProviderKey := 'Votre_Cle_API';
  MapApiKeys.SecurityCode := 'Votre_Code_Securise';
  MapApiKeys.Version := '1.4.22';
  MapApiKeys.Activate(True);
end;

L'activation de ce composant initialise l'environnement pour toutes les instances de carte dans l'application.

Test et déploiement

Après avoir suivi ces étapes, lancez l'application. La carte devrait s'afficher correctement dans le formulaire, avec tous les contrôles configurés. Cette méthode offre une intégration native et performante des fonctionnalités cartographiques dans les applications web Delphi.