Carte

Map trace les lignes Dataverse à partir d’une vue ou d’une requête à leur latitude et longitude, à côté de marqueurs, lignes, zones et cercles de votre propre taille. Un composant, identique sur Blazor et React, est dessiné par le fournisseur que vous choisissez : Azure Maps, Esri, Google, OpenStreetMap ou tout autre style MapLibre.

Fournisseurs

La configuration du portail nomme son fournisseur et contient les clés de chaque fournisseur, dans la PowerPortalsPro:Maps section, donc une carte doit n’en nommer aucun et aucune page ne contient de clé. Les marqueurs, clusters, fenêtres pop-up et clics fonctionnent de la même manière sur chaque fournisseur :

• Azure Maps : aucune clé du tout, car le portail se connecte avec sa propre identité (ci-dessous). Son attribution est indiquée comme le demandent ses termes.
• Esri : une clé API ArcGIS dans Esri:ApiKey, et tout style de carte de base ArcGIS à la place des rues.
• Google : une clé API JavaScript de Maps dans Google:ApiKey, et un identifiant de carte pour une carte stylisée dans Google Cloud.
• OpenStreetMap : pas de clé, et le fournisseur lorsqu’il n’y en a pas pour le développement et une utilisation légère. La politique de tuiles d’OpenStreetMap exclut une utilisation intensive ; nomme ton propre serveur de tuiles en OpenStreetMap:TileUrl production.
• MapLibre : toute URL de style MapLibre ou de tuiles raster dans MapLibre:StyleUrl ou MapLibre:TileUrl, comme MapTiler, OpenFreeMap, Stadia ou votre propre serveur.

Les clés d’Esri et de Google atteignent le navigateur du spectateur, qui les envoie au fournisseur, comme le font toutes les cartes web. Limitez chacune aux adresses de votre portail dans la console du fournisseur.

Une page ne nomme un fournisseur que pour utiliser un autre que celui du portail, et ne précise que son apparence : un style, un identifiant de carte, une vue des frontières contestées. Ce qu’elle laisse non défini provient de la configuration. Dans un thème sombre, la carte passe au style sombre du fournisseur ; UsePortalTheme ce changement est désactivé.

Azure Maps sans clé

Une carte Azure Maps se connecte avec des tokens Entra que le portail délivre à sa propre identité, celle qu’il relie à Dataverse, donc aucune clé Azure Maps n’est nécessaire ni n’atteint le navigateur. Attribuez à cette identité le rôle Azure Maps Data Reader sur le compte Azure Maps et rien de plus, puis définissez AzureMaps:ClientId l’identifiant client sur la page d’authentification du compte.

Chaque spectateur détient le jeton pendant son exécution, donc il ne peut faire que ce que ce rôle permet ; limiter les origines autorisées du compte aux adresses de votre portail également. La carte demande un nouveau jeton avant son expiration. Une page demande une fois, et un spectateur peut recevoir 120 jetons par minute sauf PowerPortalsPro:Maps:RateLimit indication contraire ; les visiteurs non connectés sont comptabilisés par leur adresse, que tous les membres d’un bureau partagent.

Lignes Dataverse

Affichez une vue ou une requête FetchXML, et chaque ligne avec une latitude et une longitude devient un marqueur nommé par le nom principal de la table. Les lignes sont lues avec les permissions de l’utilisateur, comme celles d’une grille, et cliquer sur une affiche les colonnes de sa vue.

Les lignes sans les deux coordonnées sont exclues de la requête. La carte affiche 1 000 lignes sauf MaxRows indication contraire (au maximum 5 000) et note sur la carte lorsqu’il y en a plus.

Les lignes sans coordonnées peuvent les avoir remplies à partir de leurs adresses au fur et à mesure de leur sauvegarde : voir Géocodage.

Plusieurs tables

Avec MultiTable (Réagir : multiTable), la carte montre les lignes de chaque table que le serveur enregistre pour les cartes avec ForMaps, chaque table dans sa propre couleur avec une légende. L’enregistrement nomme les colonnes contenant la latitude et la longitude d’une ligne, qui sont toujours lues. DefaultTables choisit les tables affichées en premier et Tables celles qu’elle peut afficher ; Regarding réduit à les lignes autour d’un enregistrement.

Une table dont les coordonnées sont enregistrées avec AddMapCoordinates, ou remplies par AddGeocoding, est enregistrée pour les cartes avec ForMaps() uniquement : voir Géocodage.

Une barre d’outils au-dessus de la carte choisit la vue : chaque table, ou une vue de plusieurs tables enregistrées avec AddMultiTableView et ForMaps(). ViewIds (Réagir : viewIds) ne propose que les vues enregistrées qu’elle nomme, dans son ordre, et DefaultViewId (defaultViewId) celle sur laquelle elle s’ouvre. Son menu Filtre active ou désactive les tables et modifie les filtres de chaque table. Avec AllowSavedViews (Réagir : allowSavedViews), un utilisateur connecté peut enregistrer ce que la carte montre comme une vue propre : voir Vues sauvegarées.

Trouver des archives près d’un lieu

Avec (Réagir : allowNearSearch), une carte de plusieurs tables possède un bouton Proche dans sa barre d’outils. Elle trouve un lieu — une adresse, avec la recherche propre au fournisseur de la carte, ou la localisation du visiteur, que le navigateur lui demande de partager — et la carte affiche alors uniquement les lignes à la distance choisie, la plus proche en première sur chaque table : le cercle est dessiné, la carte y est adaptée, et chaque fenêtre contextuelle indique la distance.NearDistances (nearDistances) définit les distances proposées, 1, 5, 10, 25, 50 et 100 sauf si elle est définie, NearDistance (nearDistance) celle à laquelle elle commence sauf si elle AllowNearSearch est définie, 25 sauf si elle est définie, et NearDistanceUnit (nearDistanceUnit) si elle commence en miles, par défaut ou en kilomètres ; le visiteur peut changer. Voyez-la sur la démo Prochein.

Chaque table est lue selon ses coordonnées enregistrées, avec les permissions du visiteur : le serveur lit la case autour du cercle, garde les rangées à distance par rapport au sol, et retourne la plus proche. Une recherche près d’un lieu compte au maximum 500 rangées, la plus proche, et la légende de la carte indique quand il y en avait plus ; NearSearchOptions.MaximumMatches augmente ou diminue ce chiffre, jusqu’à 5 000. Un visiteur qui ne peut pas lire les coordonnées d’une table ne trouve aucune de ses rangées.

Fenêtres contextuelles et clics

Cliquer sur un objet, un marqueur ou une ligne, une zone ou un cercle, se relève OnItemClick avec l’objet, ses données et l’endroit où il a été cliqué, puis s’ouvre une fenêtre pop-up au-dessus. La fenêtre pop-up est une carte Fluent avec votre propre contenu : un modèle sur Blazor, une fonction de rendu sur React. Un clic sur la carte elle-même affiche OnMapClick sa position.

Pour répondre à un clic à votre façon, ouvrez la page d’un enregistrement, par exemple, ou sélectionnez une région, appelez PreventDefault() au clic (preventDefault() sur React) et la carte n’ouvre aucune fenêtre pop-up pour cela. ShowPopups Réglez sur False Turn Popups désactivés pour chaque élément.

L’en-tête d’une ligne fait référence à la page de son enregistrement, celle enregistrée pour sa table avec AddRecordPage ( voir Pages d’enregistrement), sur une carte d’une ou plusieurs tables. RecordUrl la lie ailleurs : une URL avec {0} à la place de l’id de la ligne et {1} celle de sa table. ShowRecordLinks (Réagir : showRecordLinks) défini sur faux désactive les liens. Un élément de vos propres liens vers son Urlfichier . Sur React, onNavigate suit le lien avec votre routeur.

Les marqueurs à un endroit, comme les contacts à une adresse, ne se défont jamais en zoomant, donc leur groupe les liste à la place.

Couleurs par colonne

ColorColumn colorer le marqueur de chaque ligne selon son option dans une colonne de choix, statut, raison de statut ou oui/non : la couleur que l’option a dans Dataverse, ou l’une des palettes de Fluent lorsqu’elle n’en a pas, avec une légende des options sur la carte. Les lignes sans valeur sont grises. Pour toute autre règle, RecordColorSelector sur Blazor et une fonction pour recordColor sur React donnent à chaque ligne sa propre couleur.

Recherche d’adresse

ShowAddressSearch place une boîte de recherche au-dessus du coin de la carte. Elle trouve les adresses et lieux avec le fournisseur du portail, place en vue en premier, et épingle celui choisi ; OnAddressSelected remet la page à l’endroit et la nul une fois la recherche effacée. AddressSearchCountries La garde dans certains pays, et GoToAddressAsync (goToAddress dans la référence de React) effectue des recherches à partir du code.

Azure Maps, Esri et Google suggèrent des lieux comme types de visiteurs. La clé de Google doit activer l’API Places (Nouveau), et la clé d’Esri son privilège de géocodage. OpenStreetMap et MapLibre Maps recherchent dans Nominatim d’OpenStreetMap, dont la politique d’utilisation ne permet qu’un usage léger et jamais en tant que personne tape, donc ils cherchent quand on appuie sur Entrée ; nommer votre propre serveur Nominatim dans OpenStreetMap:GeocoderUrl ou MapLibre:GeocoderUrl pour en savoir plus.

Address (address dans React) affiche une adresse sans boîte de recherche : la carte la trouve avec la même recherche une fois qu’elle est dessinée, et à chaque fois qu’elle change, elle l’épingle et zoome dessus. Un spinner s’affiche pendant qu’elle regarde, et un message quand elle n’est pas trouvée. C’est ce que AddressDisplayValuela broche de la carte s’ouvre pour une adresse sans coordonnées.

Impression

ShowPrintButton (showPrintButton dans React) ajoute un bouton Impression — sur la barre d’outils d’une MultiTable carte, sinon dans le coin supérieur droit de la carte — qui affiche la carte telle qu’elle l’affiche, avec ses épingles, sa légende, la fenêtre pop-up ouverte et l’attribution du fournisseur. PrintTitle est le titre au-dessus, et PrintEntries liste les enregistrements en dessous, chacun à côté de l’étiquette de son code PIN. Un Label marqueur est dessiné sur son code à la place du point : donne un nombre aux arrêts et l’impression se lit comme une feuille de route. PrintAsync() (print() sur la référence React) imprime depuis un bouton propre à la page, et OnPrintChanged (onPrintChange) indique quand la carte peut être imprimée et si elle peut être enregistrée en tant qu’image, pour que ce bouton suive.

Azure Maps, Esri, OpenStreetMap et MapLibre sont imprimés comme une image de la carte, donc la page autour de la carte est laissée de côté et la carte ne bouge pas ; le même bouton sauvegarde également cette image comme fichier PNG (SaveImageAsync, ou saveImage()). Une fenêtre pop-up ouverte est dessinée sur l’image avec son titre et ses champs, ou les marqueurs qu’elle liste ; une affichant le contenu propre de la page (PopupTemplate, ou renderPopup) est dessinée avec le titre de son article. Une carte Google ne peut pas être copiée dans une image, elle est donc imprimée telle qu’elle est sur la page, popup inclus, le reste de la page est exclu de l’impression, et n’offre aucune image à sauvegarder. Un fournisseur à vous est imprimé comme image lorsque sa surface implémente capture.

Les caractéristiques propres au fournisseur

NativeOptions sont transmis à la carte du fournisseur au fur et à mesure de sa création, plutôt que sur la carte de la carte. Cela active Street View pour Google, par exemple, ou permet à une carte MapLibre de zoomer uniquement avec la molette de défilement (cooperativeGestures: false) ; par défaut, elle nécessite Ctrl, comme Google sur une page qui défile, donc la page défile au-delà. L’objet carte du fournisseur est également disponible sur votre propre JavaScript : GetNativeMapAsync sur Blazor, native sur la référence React.

Votre propre prestataire

Un fournisseur dessine la carte de base et les formes, place des éléments et rapporte les clics et les déplacements. Tout le reste appartient à la carte. Inscrivez-en une avec son nom, puis nommez-la dans les paramètres du fournisseur de la carte.

Sur Blazor, utilisez CustomMapProvider avec le nom que vous avez enregistré dans le JavaScript de votre page.

Configuration React

MapLibre, qui dessine tous les fournisseurs sauf Google, charge un script worker à partir de son propre fichier. Installe maplibre-gl à côté @powerportalspro/react-mapsde , et indique-lui où ton bundler a placé le worker une fois, avant qu’une carte ne soit dessinée. Blazor n’a pas besoin de configuration.