Simple CSS Maps
Output Readme Download Replit Sel. & Copy Full

About

This repl creates interactive maps with just HTML, CSS, and SVG. If that is something you want to do with your life. These maps are simpler to understand than the later maps.

To view this on TripleLog, click here. For better maps, go to this repl.

To learn more, read this blog post.

HTML

The index.html file is a messy generated file with the CSS doing the logic.

SVG

You will need an SVG map. A map of the US is included, but you can also create one from the previous repl.

CSS

Add CSS by editing the style.css file that is linked to in the head section or inline edit the style section in the head.

JavaScript

JavaScript is used to generate the HTML/CSS. Run the index.js server to create the HTML from the template file and SVG map. The file can be adapted to work with other SVGs.