Composant Delphi / Google Maps / OpenStreetMap / Leaflet  / Mappilary / Native Maps 100% Delphi 0% WebBrowser 0% Javascript

Shapes

Vous êtes ici :TECNativeMap

Pour utiliser les formes vous devez rajouter l'unité uecNativeShape

74

Tous les éléments positionnés sur la carte sont accessibles au travers de la propriété Shapes de type TECShapes, ils descendent tous de la classe TECShape

Lorsque vous ajoutez plusieurs éléments à la suite encadrez-les par le couple BeginUpdate / EndUpdate

22

// for optimisation
map.shapes.BeginUpdate;

map.Shapes.Markers.add(lat1,lng1);
map.shapes.Markers.add(lat2,lng2);
...
map.shapes.EndUpdate;

Styles

Au lieu de décorer manuellement chaque élément vous pouvez définir des régles pour leur appliquer un style

Groupes ( TECShapes )

Un groupe gère un ensemble d'éléments, en fait la propriété Shapes est le groupe par défaut, vous accédez à un groupe par la propriété Group['name']

Vous pouvez aussi y accéder par un index au travers de la propriété Groups

75

for i:=0 to map.groups.count-1 do
map.groups[i].Clear;

// or by iterator

Group : TECShapes;

for Group in map.Groups do
Group.Clear;


procedure Clear
vide le groupe
procedure BeginUpdate
Ne pas répercuter immédiatement les ajouts d'éléments dans le groupe, assure une meilleur performance
procedure EndUpdate
Répercuter les ajouts au groupe

// for optimisation
map.Group['group1'].BeginUpdate;

map.Group['group1'].Markers.add(lat1,lng1);
map.Group['group1'].Markers.add(lat2,lng2);
...
map.Group['group1'].EndUpdate;

procedure fitBounds
Affiche la carte de manière a ce que tous les éléments du groupe soient visible dans le meilleur zoom

Les propriétés Pois, markers, lines et Polygones disposent aussi d'une procedure fitBounds

76
procedure SaveToFile(const Filename: string)
Enregistre le groupe dans un fichier, le format est déterminé par l'extension .gpx, .kml ou format texte propre à TECNativeMap
function LoadFromFile(const Filename: string): boolean
Charge le groupe avec le contenu d'un fichier, le format est déterminé par l'extension .gpx, .kml ou format texte propre à TECNativeMap

L'événement OnLoad est déclenché lorsque le contenu est totalement disponible

77
property Clusterable : boolean

Active les support des Clusters, cela permet de regrouper des markers ou des pois proches pour une meilleure visibilité

Fig. 92 Clustering

property ClusterManager : TECClusterManager
property Pois: TECShapePOIList
Liste des éléments de type TECShapePOI
property Markers: TECShapeMarkerList
Liste des éléments de type TECShapeMarker
property Lines: TECShapeLineList
Liste des éléments de type TECShapeLine
property Polygones: TECShapePolygoneList
Liste des éléments de type TECShapePolygone
property InfoWindows: TECShapeInfoWindowList
Liste des éléments de type TECShapeInfoWindow

Les listes d'éléments disposent d'un itérateur comme les groupes

23

// Iterator for all list of shapes (markers, pois, lines, polygones and infowindows )

var poly : TECShapePolygone;

for poly in map.shapes.polygones do
begin
poly.color := clRed;
end;

property MaxZoom: byte
Niveau maximal de zoom pour lequel les éléments sont affichés, au-dessus le groupe ne s'affiche pas
property MinZoom: byte
Niveau minimal de zoom pour lequel les éléments sont affichés, en dessous le groupe ne s'affiche pas
property Zindex : longint
Les groupes s'affichent dans l'ordre croissant de leur ZIndex
function TopZindex : longint;
Retourne le ZIndex le plus élevé de l'ensemble des éléments du groupe

TECNativeMap.TopGroupZindex retourne le ZIndex le plus élevé de tous les groupes

78
property Clickable : boolean
Indique si l'ensemble des éléments sont clickables

Les éléments ont eux aussi une propriété clickable

79
property Serialize : boolean
Indique si le groupe doit être sauvegardé lorsque l'on enregistre l'ensemble de la carte

Ne s'applique pas si l'on sauvegarde directement le groupe

80


map.Group['group1'].Serialize := true;
map.Group['group2'].Serialize := false;

map.SaveToFile(filename); // group2 not save

property Visible: boolean
Affiche/Cache le groupe
property Show: boolean
Affiche/Cache le groupe mais contrairement à visible les éléments restent accessible à la souris

Fig. 93 TECShapes.Show

property ShowHint: boolean
Autorise l'affichage de la propriété Hint des éléments sous la forme d'une bulle lors du survol de la souris
property Name: string
nom du groupe en lecture seule
property ToTxt: string;
Import/Export au format natif
property ToGpx: string;
Import/Export au format Gpx
property ToKml: string;
Import/Export au format Kml

Ajouter des Shapes

Vous pouvez utiliser les raccourcis suivant pour ajouter vos éléments

function TNativeMapControl.AddPOI(const Lat, Lng: double; const GroupName: string = ''): TECShapePOI;


function TNativeMapControl.AddMarker(const Lat, Lng: double; const GroupName: string = ''): TECShapeMarker;


function TNativeMapControl.AddLine(const Lat, Lng: double; const GroupName: string = ''): TECShapeLine;


var line : TECShapeLine;
...
// create line
line := map.addLine(lat,lng);
// use this syntax for add line in group
// line := map.addLine(lat,lng,'your group');

// don't free ! or use remove
// line.remove

// to find your item in the list use indexof
// map.shapes.lines[line.indexof]
// map.group['your group'].lines[line.indexof]

// block repaint
line.beginupdate;
// add more points in line
line.add(lat2,lng2);
line.add(lat3,lng3);
// now of for repaint
line.endupdate;

function TNativeMapControl.AddLine(const dLatLngs: array of double; const GroupName: string = ''): TECShapeLine;


var line : TECShapeLine;
...
// create line
line := map.addLine([lat,lng,lat2,lng2,lat3,lng3]);
// use this syntax for add line in group
// line := map.addLine([lat,lng,lat2,lng2],'your group');

// block repaint, no need with addline but now yes
line.beginupdate;
// add more points in line
line.add(lat4,lng4);
line.add(lat5,lng5);
// now of for repaint
line.endupdate;

function TNativeMapControl.AddPolygone(const Lat, Lng: double; const GroupName: string = ''): TECShapePolygone;


function TNativeMapControl.AddPolygone(const dLatLngs: array of double; const GroupName: string = ''): TECShapePolygone;


function TNativeMapControl.AddInfoWindow(const Lat, Lng: double; const GroupName: string = ''): TECShapeInfoWindow;

Vous ne devez pas détruire manuellement les éléments ainsi créé si besoin utilisez remove, ils sont maintenu dans les listes de leur groupe respectif

28

TECClusterManager

Les propriétés suivantes vous permettent de modifier l'affichage des clusters

property Color : TColor
property TextColor : TColor
property BorderColor : TColor
property BorderSize : integer
property FontSize : integer
property Opacity : byte
property WidthHeight : integer

property MaxPixelDistance : integer

Les éléments qui sont à moins de MaxPixelDistance d'un cluster y sont regroupés, 60 pixels par défaut

property DrawWhenMoving : boolean

Permet d'afficher les clusters pendant que l'on déplace la carte, par défaut true

property MaxZoom : byte

Si le zoom est superieur à MaxZoom on ne regroupe pas les éléments, defaut 18

property OnAddShapeToCluster : TOnAddShapeToCluster (sender : TECCluster; const Shape:TECShape;var cancel:boolean)

Déclenché lors de l'ajout d'un élément dans un cluster, vous pouvez refuser en basculant cancel à true, défaut false

property OnColorSizeCluster : TOnColorSizeCluster (const Cluster : TECCluster;
var Color:TColor;var BorderColor:TColor;var TextColor:TColor,
var WidthHeight,FontSize:integer)

Déclenché avant l'affichage pour vous permettre d'ajuster les propriétés

property OnDrawCluster : TOnDrawCluster (const Canvas : TECCanvas; var rect : TRect; Cluster : TECCluster)

Si vous vous branchez sur cet évenement vous prenez en charge intégralement le dessin du cluster

property OnMouseOverCluster : TOnNotifyEventCluster (const Cluster : TECCluster)

Déclenché par l'entrée de la souris sur le cluster

property OnMouseOutCluster : TOnNotifyEventCluster (const Cluster : TECCluster)

Déclenché par la sortie de la souris du cluster

exemple, changer la couleur en fonction du nombre d'éléments contenu par le cluster

map.Shapes.Clusterable := true;
map.Shapes.ClusterManager.OnColorSizeCluster := doOnColorSizeCluster;

procedure TForm.doOnColorSizeCluster(const Cluster : TECCluster;
var Color:TColor;var BorderColor:TColor;var TextColor:TColor;
var WidthHeight,FontSize:integer
);
begin

if Cluster.Count< 10 then
begin
Color := clGreen;
end

else

if Cluster.Count< 100 then
begin
Color := clBlue;
end

else

Color := clRed;

end;

Élément TECShape

Tous les éléments affichable descendent de TECShape, ils partagent les propriétés suivantes

property Clusterable : boolean

Permet d'exclure l'élement des clusters, par défaut true

map.shapes.markers[10].Clusterable := false;
property Address: string
Retourne l'adresse de l'élément, la recherche est bloquante
procedure Location

Geolocalise l'élément, équivalent Address mais n'est pas bloquante

Déclenche OnShapeLocation(item:TECShape,GeoResult:TECGeoResult;const Valid:boolean);

Si le TECShape n'a pas d'événement OnShapeLocation c'est le OnShapeLocation de son groupe qui est déclenché.

Valid est a true si la position actuelle de l'élément est la même que celle lors du déclenchement de la recherche.

map.shapes.OnShapeLocation := doShapeLocation;
// Asynchronous search address for Markers[0],
// when it is found map.shapes.OnShapeLocation is triggered
map.shapes.Markers[0].Location;
//
procedure TForm1.doShapeLocation(item:TECShape;const GeoResult:TECGeoResult;const Valid:boolean);
begin

if assigned(item) and Valid then
begin
// address
GeoResult.address;
end;

end;


function DistanceTo(Shape:TECShape)

Retourne la distance en kilomètres entre les deux éléments

procedure InfoWindow(const content:string);

procedure InfoWindow(window:TECShapeInfoWindow);

Associe une infoWindow à l'élément, elle s'affiche lors d'un click sur l'élément.

my_marker.InfoWindow('content for my marker');
// you can also use one infoWindow for many shapes
id := map.shapes.infoWindows.add(0,0,'the same for all');
my_marker1.InfoWindow(map.shapes.infoWindows[id]);
my_marker2.InfoWindow(map.shapes.infoWindows[id]);
// for delete use nil
my_marker3.InfoWindow(nil);
procedure Remove
Permet de supprimer directement l'élément
procedure SetPosition(const dLat, dLng: double)
Déplace l'élément en latitude et longitude
procedure SetDirection(const dLat, dLng: double)
Déplace l'élément en latitude et longitude, change son angle de rotation pour qu'il pointe dans le sens de la direction
procedure CenterOnMap
Déplace la carte de manière à ce que l'élément soit au centre
function IndexOf: integer
Index de l'élément dans sa liste (Pois, Markers, Lines ou Polygones)
function ShowOnMap: boolean
Indique si l'élément est dans la partie visible de la carte
property Animation : TECShapeAnimation
Permet d'animer la forme voir Animation
property Latitude: double
Latitude de l'élément
property Longitude: double
Longitude de l'élément
property Altitude: double
Altitude de l'élément, vous devez avoir connecté un composant TECGeolocalise à votre TECNativeMap
property Color: TColor
Couleur de l'élément
property HoverColor: TColor
Couleur au survol
property Tag: longint
Vous pouvez l'utiliser librement
property Visible : boolean
Affiche ou cache l'élément
property TrackLine : TECShapeLine

Si TrackLine est définie la trace du déplacement de l'élément sera automatique gérée

Pour l'activer il suffit simplement d'y accéder, vous pouvez aussi directement assigner une ligne

FTracker := map.AddMarker(Latitude,Longitude) ;
// To activate the trace just access TrackLine
// line is created in the same group as FTracker
FTracker.TrackLine.visible := true;

// You can also pass a line
FTracker.TrackLine := your_line;

// for stop tracking set to nil , the line is free
FTracker.TrackLine := nil

Fig. 94 Trackline

property isTrackLineActive : boolean
Permet de savoir si une TrackLine est activée.

Si vous testez directement TrackLine elle est automatiquement créé si elle n'existe pas !

81
property Serialize : boolean
Permet d'indiquer si l'élément peut être enregistré dans un fichier (oui par défaut)
property Clickable
Rend l'élément réactif à la souris
property ZIndex
Les éléments s'affichent dans l'ordre croissant de leur ZIndex
BringToFront

Force l'élément a s'afficher au premier plan sans tenir compte des zindex

Un seul élément à la fois peut-être au premier plan, BringToFront ne change pas l'ordre d'affichage qui reste dépendant du ZIndex

82
SendToBack
Retour à l'ordre normal d'affichage
property Draggable
Rend un élément déplaçable à la souris
property Angle
Angle de rotation en degré (0-360)

Disponible pour les TECShapeMarker et TECShapePOI

29
property Hint: string
Texte affiché dans la bulle lorsque la souris survole l'élément, la propriété ShowHint du groupe parent doit avoir été basculé à true

Le texte peut être enrichi avec certains balises html voir TECShapeInfoWindow

24
property EnabledHint
Active/Désactive l'affichage de la bulle d'information de l'élément
property MaxShowHint
indique le nombre de fois que sera affichée la bulle d'information, vous pouvez la réactiver avec EnabledHint ou en rechargeant MaxShowHint
property PropertyValue[Name]
vous permet d'accéder à la valeur de la propriété Name

Vous pouvez utilisez PropertyValue pour stocker vos propres données, cette propriété est aussi utilisée par les tuiles vectorielles, les données OpenStreetMap y sont sauvegardées.

83
property Properties
Liste des Property/Value, au format "nom:valeur", chaque couple est séparé par un retour chariot.
property Group:TECShapes
Groupe auquel l'élément appartient
property Selected

Sélectionne ou non un élément, un élément sélectionné s'affiche comme s'il était survolé

La propriété Selected de la carte contient tous les éléments sélectionnés

// you can use Iterator

var shape:TECShape

for shape in map.Selected do
begin
..
end;

TECSelectedShapesList

Type de la liste des éléments sélectionnés, vous donne accès à

function ByArea(const NEALat,NEALng,SWALat,SWALng :double):integer;
Sélectionne les élements se trouvant dans la zone délimitée par NEALat,NEALng (coin haut-droit) et SWALat,SWALng (coin bas-gauche)
function ByKMDistance(const FLat,FLng,FKMDistance :double):integer;
Sélectionne les éléments situés à moins de KMDistance (distance en km) du point FLat,FLng
procedure UnSelectedAll
Déselectionne tous les éléments sans les supprimer de la carte
procedure Clear
Efface de la carte tous les éléments sélectionnés

function count : integer;

procedure SaveToFile(const filename:string);

property Item[index: integer]: TECShape
Retourne l'élément dont on passe l'index
property ToTxt:string
Retourne les éléments sélectionnés dans le format texte interne de TECNativeMap (en lecture seulement)
property GroupFilter : TStringList
Permet de filtrer en fonction des groupes d'éléments, laissez vide pour pouvoir sélectionner les éléments sans tenir compte de son groupe
property OnChange:TNotifyEvent ;
Déclenché par l'ajout/suppression d'un élément à la liste des sélectionnés

Recherche

Vous avez plusieurs fonctions pour effectuer des recherches dans vos éléments


function FindShapeByArea(const SWALat, SWALng, NEALat, NEALng: double;
                        const ShapeList: TList<TECShape>;
                        const FilterShapes : TNativeShapes = [];
                        Filter:TOnShapeFilter=nil): integer;

Rempli ShapeList avec les éléments se trouvant dans une zone rectangulaire dont on indique les coins Sud-Ouest et Nord-Est

FilterShapes permet de filtrer les éléments recherchés, par défaut tous, exemple [nsMarker,nsPoi] pour ne rechercher que des TECShapeMarker et TECShapePOI

Filter permet d'ajouter une procedure pour filtrer la recherche

// find the cafes located less than 2km
map.FindShapeByKMDistance(map.Latitude,map.Longitude, 2.0,liste,[nsMarker,nsPoi],FilterCafe);
...

procedure FilterCafe(const Shape: TECShape; var cancel: boolean);
begin
cancel := shape.PropertyValue['kind']<>'cafe' ;
end;

function FindShapeByKMDistance(const FLat, FLng, FKMDistance: double;
                                const ShapeList: TList<TECShape>;
                                const FilterShapes : TNativeShapes = [];
                                Filter:TOnShapeFilter=nil): integer;
Rempli ShapeList avec les éléments qui se situent à moins de FKMDistance km du point FLat,FLng
function FindShapeByFilter(const ShapeList: TList<TECShape>;
                                const FilterShapes : TNativeShapes;
                                Filter:TOnShapeFilter): integer;

Toutes ces fonctions retournent le nombre d'éléments trouvé.

84

Pour les versions de Delphi qui ne supportent pas les génériques ShapeList est une simple TList

85

Événements

Les formes déclenchent les événements suivant :


property OnShapeMove : TOnShapeMove

property OnShapeDrag : TOnShapeMove

property OnShapeDragEnd : TNotifyEvent

property OnShapeMouseOver : TOnShapeMouseEvent

property OnShapeMouseOut : TOnShapeMouseEvent

property OnShapeMouseDown : TOnShapeMouseEvent

property OnShapeMouseup : TOnShapeMouseEvent

property OnShapeClick : TOnShapeMouseEvent

property OnShapeRightClick: TOnShapeMouseEvent

property OnShapeDblClick : TOnShapeMouseEvent

property OnShapePathChange : TNotifyEvent

property OnShapeLocation : TOnShapeLocation


Les événements peuvent être attribués individuellement à chaque élément, dans ce cas ils ne sont pas répercutés au niveau de TECNativeMap

25


map.shapes.Markers.add(lat1,lng1);
map.shapes.Markers.add(lat2,lng2);

// connect directly to the event
// OnshapeClick of TECNativeMap will not be triggered for marker 0
map.shapes.markers[0].OnShapeClick := MarkerShapeclick;

Aller à la page
Composant Delphi / Google Maps / OpenStreetMap / Leaflet  / Mappilary© 2016 ESCOT-SEP Christophe - Réalisé avec Help&Web - RSS - RSS - Google+