UNPKG

marvinj-angular

Version:

This is a fork from MarvinJ Framework with minimal adpaptation for use in Angular and Ionic projects

57 lines (37 loc) 2 kB
# MarvinJ For Angular and Ionic This is a fork from MarvinJ Framework with minimal adpaptation for use in Angular and Ionic projects. MarvinJ is a pure javascript image processing framework derived from Marvin Framework. You can check all features on the official MarvinJ project [http://marvinj.org/en/index.html] MarvinJ was created to be the Javascript version of Marvin Image Processing Framework aiming to provide the same features in the web, server and mobile platforms powered by Javascript. If you are not familiar with Marvin Framework and want to play with MarvinJ, don't worry. The rest of this article shows the basic image processing features of MarvinJ using JSFiddle snippets that you can make your own version and play with it. ### Requirements *Angular >= 12* ### Install ```shell npm install marvinj-angular ``` ### Working with MarvinJ Image Processor In the case of MarvinJ we load images from URLs and usually use a HTML5 canvas for displaying processed images. ```typescript import { Marvin, MarvinImage } from "marvinj-angular/marvinj"; ... strUrlImage = "https://marvinj.org/images/example2.jpg"; const objImg = new Image(); const objCanvas: HTMLCanvasElement = document.createElement("canvas"); const MarvinImageProcessor = new MarvinImage(); var image; MarvinImageProcessor.load(strUrlImage, function () { image = this.clone(); // Redimensioning proportionally with a scale filter Marvin.scale(this, image, 200); // Converting with a halftone filter (see more in http://marvinj.org/en/algorithms.html ) Marvin.halftoneErrorDiffusion(image, image); objCanvas.width = image.width; objCanvas.height = image.height; image.draw(objCanvas); objImg.src = objCanvas.toDataURL(); }); ``` Continue Reading: ### Know more about others image processor algorithms [http://marvinj.org/en/algorithms.html] ### "Playing with image processing in Javascript using MarvinJ 1.0 (JSFiddle Examples)" http://marvinj.org/en/releases/marvinj_1.0.html