Add animation for maps from prior map
If you add multiple maps to your YFM, and then you use start: previous
in your animation configuration, this will make Maps animate from the prior location when the intersection observer fires (i.e. when the next map scrolls into view).
Example:
_config.yml
:
title: Public.do
description: Do incredible things with public domain works.
maps:
animate:
duration: 2000
start: previous
A sample post:
---
title: "The Pirahã people and their language"
published: true
date: 2023-09-28
maps:
function_based_internet_solution:
center: '6.514166°S, 61.729860°W'
index: 0
function_based_internet_solution2:
center: '26.514166°S, 21.729860°W'
index: 1
function_based_internet_solution3:
center: '16.514166°S, 41.729860°W'
index: 2
function_based_internet_solution4:
center: '18.514166°S, 21.729860°W'
index: 3
function_based_internet_solution5:
center: '6.514166°S, 61.729860°W'
index: 4
function_based_internet_solution6:
center: '26.514166°S, 21.729860°W'
index: 5
function_based_internet_solution7:
center: '16.514166°S, 41.729860°W'
index: 6
function_based_internet_solution8:
center: '18.514166°S, 21.729860°W'
index: 7
---
<script>
import Map from '$svekyll/Map.svelte';
</script>
<Map center={maps.function_based_internet_solution.center} {maps}/>
<Map center={maps.function_based_internet_solution2.center} {maps}/>
<Map center={maps.function_based_internet_solution3.center} {maps}/>
<Map center={maps.function_based_internet_solution4.center} {maps}/>
<Map center={maps.function_based_internet_solution5.center} {maps}/>
<Map center={maps.function_based_internet_solution6.center} {maps}/>
<Map center={maps.function_based_internet_solution7.center} {maps}/>