Custom Popup Content
This sample demonstrates how to work with custom content elements within the PopupTemplate's content.
There are five types of popup elements: FieldsPopupContent, MediaPopupContent, TextPopupContent, AttachmentsPopupContent, and CustomPopupContent.
The CustomPopupContent's value is set via the CreatorFunction property, or by providing child content inside the component.
The CreatorFunction property has an event parameter with the selected Feature graphic, and returns
an HTML string value to be rendered. The child content of CustomPopupContent can be either HTML content or a GeoBlazor Widget.
In this sample, we combine three different types of custom content elements: an image, a SearchWidget,
and a CreatorFunction that parses the selected graphic for data.
GeoBlazor
dymaptic
About this sample
This GeoBlazor Pro sample, written in Blazor for .NET developers, demonstrates custom PopupTemplate content elements from the ArcGIS Maps SDK for JavaScript exposed through GeoBlazor's CustomPopupContent, PopupWidget, and SearchWidget Razor components. The page shows a 2D topographic map of the contiguous United States displaying a FeatureLayer of public and private schools by state. Clicking a state opens a docked popup (pinned to the right edge) containing three custom content blocks: a GeoBlazor logo image at the top, an embedded SearchWidget that lets the user search by state name within the layer, and a dynamically generated HTML block that runs a server-side QueryService statistics query against a private-schools service and summarizes elementary, secondary, and combined private-school counts and average enrollment for the selected state. The sample is intended to demonstrate how to compose images, widgets, and code-driven HTML inside a single popup using the CreatorFunction extension point.