Skip to content

Instantly share code, notes, and snippets.

@collardeau
Created February 21, 2020 18:05
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save collardeau/0fc88a102dc6f8a65013d17c91c2a8e7 to your computer and use it in GitHub Desktop.
Save collardeau/0fc88a102dc6f8a65013d17c91c2a8e7 to your computer and use it in GitHub Desktop.
Svelte: RoughJS setup
<script>
import rough from "roughjs/bin/rough";
// npm i roughjs@4.0.4
// https://roughjs.com/
let roughSvg;
function action(node) {
roughSvg = rough.svg(node);
const rect = roughSvg.rectangle(100, 50, 100, 50, { // x, y, width, height
fill: "red"
});
node.appendChild(rect);
}
</script>
<svg use:action />
<style>
svg {
width: 300px;
height: 150px;
background-color: white;
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment