Print Advanced (Beta) - Use ArcGIS Pro PAGX Layout File or Print Utility Service

149
1
a week ago
Brian_McLeer
MVP Regular Contributor
4 1 149

Overview

This widget brings ArcGIS Pro style map printing into ArcGIS Experience Builder without needing a print service. You share a layout from ArcGIS Pro as a layout file (.pagx), import it once in the widget settings, and the widget rebuilds that page in the browser against your live map: map frame, title and text, north arrow, scale bar, legend, pictures, and lines.

https://github.com/brianmcleer/print-advanced-widget

This is the first release and I am putting it out as a beta. I would like the community to run it against real layouts and real maps before I call it stable. If you can try it and send feedback, that would be a big help. See "What I would like help testing" below.

Note: Requires ArcGIS Experience Builder Developer Edition 1.19 or 1.20 (React 19). 1.18 and earlier are not supported.

Note: The widget dependencies install automatically with the standard "npm install" in the EB client folder. No separate install needed.

Note: Import an ArcGIS Pro layout file (.pagx) in the widget settings to define the page. There is also an optional Esri print service path if you would rather use a server side ExportWebMap service.

(view in My Videos)

What Can This Widget Do?

  • Reproduces an ArcGIS Pro .pagx layout in the browser (map frame, text, lines, north arrow, scale bar, pictures, legend), calibrated against real Pro output.
  • Exports PDF and SVG as true vector, plus PNG32, PNG8, JPG, GIF, TIFF, and EPS. No print service required.
  • Optional Esri print service path (an ExportWebMap URL) for server side layouts, which also adds AIX.
  • Print area preview drawn on the map, so you see what will print before you export. Keep the current scale, keep the current extent, set a fixed scale, or pick one from a list, with a lock toggle.
  • 12 north arrow styles and 9 scale bar styles shown as thumbnails, plus a Layout default option.
  • Output coordinate system (WKID) to print in a different projection than the map.
  • Author, copyright, and attribution tokens. Legend and map only export. Custom fonts by URL, including a Google Fonts import.
  • Recent exports list, and XML import and export of the whole configuration.
  • Administrator control over the default settings, which formats are offered, and which runtime controls end users see.

What I Would Like Help Testing

  • Your own ArcGIS Pro .pagx layouts. Import one and tell me how close the output is to Pro. If something is off, sending the .pagx and a screenshot lets me reproduce it.
  • The print area preview and scale lock, across different basemaps and projections.
  • The Esri print service path, pointed at your own ExportWebMap URL.
  • Output coordinate system, printing in a WKID different from your map.
  • Custom fonts by URL and the Google Fonts import in PDF output.

How to report back: comment here or open an issue on GitHub. Include your EB version, your browser, and any browser console errors. A short screen recording helps a lot (I use OBS Studio).

Changelog:

07/09/2026:

Add @ncramer11 as contributor. Resolved below issue.

The problem: setting.tsx gets its dropdown lists (formats, north arrow styles, scale bar styles and units) from runtime/lib/pdfRenderer.ts. That file also imports four esri/* modules, so those get pulled into the compiled settings bundle. It seems the builder page cannot always load esri modules at the moment the settings panel opens. When that happens the settings module fails with window.require is not a function in the console, and the builder shows the widget and the settings panel stuck on the loading spinner.

Commit 1: Moves those dropdown lists into a new file, src/printConstants.ts, which imports nothing from esri. pdfRenderer.ts re-exports them so the runtime code does not change at all (widget.tsx is untouched), and setting.tsx now imports from the new file. With that, the settings bundle no longer references esri and loads fine. It also shrank from about 3.3 MB to about 350 KB. I left a comment in printConstants.ts explaining why it needs to stay esri-free.

Commit 2: Swaps the seven indentLevel={1} props on SettingRow for indented. My editor flags indentLevel because it is not in ExB 1.20 typings. No difference in behavior, so feel free to skip this one if you would rather.

07/02/2026:

Initial beta release. Posted to GitHub. Looking for feedback before I mark it stable.

1 Comment
Brian_McLeer
MVP Regular Contributor

07/09/2026:

Add @ncramer11 as contributor. Resolved below issue.

The problem: setting.tsx gets its dropdown lists (formats, north arrow styles, scale bar styles and units) from runtime/lib/pdfRenderer.ts. That file also imports four esri/* modules, so those get pulled into the compiled settings bundle. It seems the builder page cannot always load esri modules at the moment the settings panel opens. When that happens the settings module fails with window.require is not a function in the console, and the builder shows the widget and the settings panel stuck on the loading spinner.

Commit 1: Moves those dropdown lists into a new file, src/printConstants.ts, which imports nothing from esri. pdfRenderer.ts re-exports them so the runtime code does not change at all (widget.tsx is untouched), and setting.tsx now imports from the new file. With that, the settings bundle no longer references esri and loads fine. It also shrank from about 3.3 MB to about 350 KB. I left a comment in printConstants.ts explaining why it needs to stay esri-free.

Commit 2: Swaps the seven indentLevel={1} props on SettingRow for indented. My editor flags indentLevel because it is not in ExB 1.20 typings. No difference in behavior, so feel free to skip this one if you would rather.

About the Author
GIS Administrator/Developer at City of Grand Junction, CO.