βοΈ Settings
Customize every aspect of your Panoramax frontendβenvironment variables, wording, and visualsβall from one place.
π 1. Environment Variables
Most low-level settings live in the .env file (see env.example). Below is a quick reference grouped by domain.
π General
| Variable | Description | Example | Notes |
|---|---|---|---|
VITE_API_URL |
Base URL of the Panoramax API | https://panoramax.ign.fr/ |
Required |
πΊοΈ Map & Viewer
| Variable | Description | Example |
|---|---|---|
VITE_TILES |
URL to a MapLibre JSON style (vector tiles) | https://data.geopf.fr/.../PLAN.IGN/standard.json |
VITE_RASTER_TILE |
Raster (aerial imagery) source (MapLibre raster spec) | https://example.com/raster.json (optional) |
VITE_ZOOM |
Default zoom (0β24) | 6 |
VITE_CENTER |
Default map center longitude,latitude |
2.213,46.227 |
VITE_DISABLE_EDITORS |
Disable the viewer editor | true |
VITE_VIEWER_SETTINGS |
Generic settings for the web viewer on homepage (docs here) | { "map-options": {"theme": "score"}, "geocoder": "ban"} (optional) |
π SEO & Analytics
| Variable | Description | Example |
|---|---|---|
VITE_TITLE |
<title> value |
Panoramax IGN: photo-cartographier les territoires |
VITE_META_TITLE |
Meta title (og:title, etc.) |
Panoramax IGN |
VITE_META_DESCRIPTION |
Meta description for SEO | L'instance Panoramax IGN permet ... |
VITE_MATOMO_HOST |
Your Mattomo url instance | https://mattomo.panoramax.openstreetmap.fr |
VITE_MATOMO_SITE_ID |
Mattomo ID of the site | 1 |
π‘ Need a reminder of how these vars are used? Check the
src/configfiles in bothapp/andadmin/.
βοΈ 2. Wording & Languages
You can fully tailor wording for both the end-user app and the admin interface.
π Locale Files
- App:
app/src/locales - Admin:
admin/src/locales
Key entries worth editing:
title,meta.title,meta.description- Help links (
upload.description,upload.footer_description_terminal, etc.)
π Translating / Adding Languages
- Edit JSON files directly (French & English provided).
- Or use the collaborative platform Weblate.
- Adding a new locale?
- Drop
{locale}.jsonin the locale folder. - Make sure the translation is close to 100% complete : you can translate with the Panoramax Weblate
- Register it in
shared/locales/index.ts.
Note
If you add a new translation locale, you must also add this localeβs translations to each translation file for the corresponding language. Example in the en-gb file :
"languages": { "fr": "French", "en-gb": "English", "pt-br": "Portuguese Brasil", "pt": "Portuguese", "hu": "Hungarian", "de": "German", "zh-hant": "Chinese (traditional)", "es": "Spanish", "it": "Italian", "da": "Danish", "eo": "Esperanto", "ja": "Japanese", "sv": "Swedish", "nl": "Dutch", "tr": "Turkish" }
- Do not forget the keycloak translation here
πΌοΈ 3. Visual Assets
Customize the look & feel by replacing the default assets:
| Asset | File | Tip |
|---|---|---|
| Logo | src/assets/images/logo.jpeg |
Use a square image for best results |
| Favicon | static/favicon.ico |
Provide multiple sizes if possible |