rveciana - svelte-mapping-transitions

Svelte mapping: Transitions

Open raw page in new tab

Third example of a map drawn with Svelte and the d3 projections. Transitions are made now when the mouse is over a region and when the projection is changed.

Check this blog post from Geoexamples for more explanations.

To test it, clone the standard svelte template by

npx degit sveltejs/template svelte-app cd svelte-app

And copy the App.svelte and Feature.svelte files into the src directory.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />

    <title>Svelte app</title>

    <link rel="stylesheet" href="global.css" />
    <link rel="stylesheet" href="bundle.css" />

    <script defer src="bundle.js"></script>
  </head>

  <body></body>
</html>