<title>rivers in text into pretty pictures!</title>
<script type="text/javascript" src="pnglib.js"></script>
<script type="text/javascript" src="tr.js"></script>
+ <style>
+ body {
+ text-align: center;
+ }
+ img {
+ image-rendering: -moz-crisp-edges; /* firefox */
+ image-rendering: -webkit-optimize-contrast; /* webkit */
+ }
+ </style>
</head>
<body>
- Put in some text, change some parameters, and get an associated image! (slight warning, using large pieces of text might take up too much memory, so start small!)
+ Put in some text, change some parameters, and get an associated image! <br>(slight warning, using large pieces of text might take up too much memory, so start small!)
<br>
<textarea name="ta" id="txt" rows="10" cols="30"></textarea>
<br>
<br>
<input type="number" id="t" value="4">
<br>
- Scaling Factor (not yet implemented)
+ Scaling Factor
<br>
<input type="number" id="scale" value="4">
<br>
<input type="button" id="go" value="Let's See it!" onclick="go()">
<br>
<div id="img_zone">
- test
</div>
</body>
</html>
console.log(w);
console.log(t);
p = mat_to_png(get_matrix(s,w,t));
- document.getElementById("img_zone").innerHTML = '<img src="data:image/png;base64,'+p.getBase64()+'">';
+ document.getElementById("img_zone").innerHTML = '<img src="data:image/png;base64,'+p.getBase64()+'" style="transform: scale('+scl+'); margin: '+scl*p.height/2+'px;">';
//d = document.createElement('div');
//d.innerHTML =
//document.getElementById("img_zone").appendChild(d);
home / projects / textrivers / commitdiff