Skip to main content

Set region status by ACF field

If Regions are linked to WordPress posts that have an ACF field, you can map that field’s values to MapSVG Region Status values (colors / enabled state).

Prerequisites

  • ACF installed and active
  • Regions connected to WordPress posts (WP Post field or equivalent setup in your map)
  • A Status field configured under Regions › Edit fields
  • You know the ACF field name and which ACF values should map to which MapSVG status IDs

Steps

  1. Open the map in the Map Editor
  2. Go to Menu › JavaScript › Map › afterLoadRegions
  3. Replace the handler with the code below
  4. Set statusFieldName to your ACF field name
  5. Edit acfToMapsvgStatuses so each ACF value maps to a MapSVG status ID
  6. Save and reload the front end
function (event){

const { map } = event

const acfToMapsvgStatuses = {
// ACF field value → MapSVG status ID
"1": 1,
"2": 2,
"3": 3
};

map.regionsRepository.getLoaded().forEach( function(regionDb){
if(regionDb.post && regionDb.post.acf){
var status = acfToMapsvgStatuses[regionDb.post.acf.statusFieldName];
if(typeof status !== "undefined"){
const regionSvg = map.getRegion(regionDb.id)
if(regionSvg){
regionSvg.setStatus(status)
}

}
}
});

}

Replace statusFieldName in regionDb.post.acf.statusFieldName with your real ACF field key.