msg2svg
v3.0.0
Published
Convert a message into a svg, seemingly random.
Downloads
5
Readme
msg2svg
What is it?
Generates a seemingly random svg "artwork" based on a provided random seed. That way, the same words would always end up generating the same seemingly random "art".
Demo?
Sure, this is all very useless, but here you go
Usage
If you for some reason need this, here it is:
Install with npm
npm i msg2svg
Require in your project
'use strict';
// If in a browser environment (but built with browserify or similar), you can
// do something like this:
var msg2svg = require('msg2svg').bind(null, document);
var redraw = function(seed) {
d3.select('svg')
.remove();
var svg = msg2svg(seed, {
width: 1000,
height: 400
});
d3.select('body')
.node().appendChild(svg.node())
};
redraw(Math.random());
document.getElementById('redraw').addEventListener('click', function() {
redraw(document.getElementById('seed').value);
});
/**
* Yeah, so say you have HTML structure something like this:
* <div>
* <input type="text" placeholder="Enter random seed" id="seed" />
* <input type="submit" value="Redraw" id="redraw" />
* </div>
*/
document.getElementById('redraw').addEventListener('click', function() {
redraw(document.getElementById('seed').value);
});
Why did you make it?
I used it in this simple project - "an extremely persistent chat application".
Here is an animated gif from that, just since I like gifs.