Support for transitional maps

[dan-bowerman]

The TCEI StoryMap project (https://storymaps.arcgis.com/stories/a4e825956b4a402ebe13dbceeba66321, reach out for credentials) demonstrates this functionality. This one might take some pondering and discussion.

Dusting off the "Areas of Interest" feature in RAMP4 might be a possibility here, but what would/could our approach be to updating a map extent dynamically based on left-hand content?

[dan-bowerman]

• RAMP API calls to change the extent/center on a point
• Second API call for highlighting
• Make these calls while scrolling through the left-hand content
• Navigation from the map back to the left-hand content?
• WCAG considerations?

[james-rae]

Proof of Concept from the RAMP side.

Go to this RAMP sample. Resize your browser and hit F12 so that both your viewer and console are visible (or 2-monitor party if you have it).

Then paste this block of code in the console. The map will tour around five points in Newfoundland.

const oids = [83, 45, 456, 375, 551];
const map = debugInstance.geo.map;
const nat = debugInstance.geo.layer.getLayer('Nature');
const hl = debugInstance.fixture.get('hilight');

const sleep = async millsecs => {
  return new Promise(resolve => {
    setTimeout(() => { resolve(); }, millsecs);
  });
};

const funtimes = async () => { 
  for (let i=0; i < oids.length; i++) {
    const g = await nat.getGraphic(oids[i], { getGeom: true, getStyle: true });
    await map.zoomMapTo(g.geometry, 4622324.434309);
    await hl.addHilight(g);
    await sleep(2500);
    await hl.removeHilight(g);
  }
};

funtimes();

In storylines, rather than a loop with a sleep timer, the scrolling items tied to map points would just need to encode the layer ID and object id they care about, and run the code to zoom and hilight when they enter the "dominant visible position".