UNPKG

1.59 kBHTMLView Raw
1<!DOCTYPE html>
2<html>
3 <head>
4 <title>Jimp browser example 1</title>
5 </head>
6 <body>
7
8 <!-- Demonstrates loading a local file using Jimp on the main thread -->
9 <script src="../lib/jimp.min.js"></script>
10 <script>
11
12 function dropShadow(x, y, b, a) {
13 var img = new Jimp(this.bitmap.width + Math.abs(x*2) + (b*2), this.bitmap.height + Math.abs(y*2) + (b*2));
14 var orig = this.clone();
15 this.scan(0, 0, this.bitmap.width, this.bitmap.height, function (x, y, idx) {
16 this.bitmap.data[ idx + 0 ] = 0;
17 this.bitmap.data[ idx + 1 ] = 0;
18 this.bitmap.data[ idx + 2 ] = 0;
19 this.bitmap.data[ idx + 3 ] = this.bitmap.data[ idx + 3 ] * a;
20 });
21 // this.resize(this.bitmap.width + Math.abs(x) + b, this.bitmap.height + Math.abs(y) + b);
22
23 var x1 = Math.max(x * -1, 0) + b;
24 var y1 = Math.max(y * -1, 0) + b;
25 img.composite(this, x1, y1);
26 img.blur(b);
27 img.composite(orig, x1 - x, y1 - y);
28 //img.autocrop();
29 return img;
30 }
31 Jimp.read("dice.png").then(function (img) {
32 console.log(img.getMIME(), img.getExtension());
33 var img = dropShadow.call(img, 20, 20, 20, 0.3)
34 img.getBase64(Jimp.AUTO, function (err, src) {
35 var img = document.createElement("img");
36 img.setAttribute("src", src);
37 document.body.appendChild(img);
38 });
39 });
40 </script>
41
42 </body>
43</html>
\No newline at end of file