ElevationProfile

Demo

• ElevationProfile

Description

The ElevationProfile is responsible for displaying the elevation profile of a hiking and its stopovers.

To use the ElevationProfile, you need to set the target, the element where to display to profile, and the map.

const profile = new sww.ElevationProfile({
  target: "profile",
  map: map,
});
Copy

Where profile is the id of the element where to display the profile and map is an OpenLayers map instance.

Then, the profile needs to be linked to the HikingEditor to the hiking editor to be updated when the hiking is changes:

const editor = new sww.HikingEditor();

editor.addEventListener("change", () => {
  const { lines, points } = editor.getProfile();
  profile.setProfile(lines, points);
});
Copy

Styling

The sww.css file must be included in the page to style the elevation profile.