Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

msg2svg

3.0.0 • Public • Published

msg2svg

Build Status Coverage Status Code Climate Dependency Status

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. Chatting with a conversation with substance

Licence

WTFPL

Keywords

none

install

npm i msg2svg

Downloadsweekly downloads

10

version

3.0.0

license

MIT

homepage

github.com

repository

Gitgithub

last publish

collaborators

  • avatar