twhitbeck / Angular Cropper
Licence: mit
Touch-enabled image cropper for AngularJS
Stars: ✭ 22
Projects that are alternatives of or similar to Angular Cropper
react-native-avatar-crop
Highly customisable <Crop /> component for React Native < 💅 >
Stars: ✭ 47 (+113.64%)
Mutual labels: cropper
Croppr.js
A vanilla JavaScript image cropper that's lightweight, awesome, and has absolutely zero dependencies.
Stars: ✭ 294 (+1236.36%)
Mutual labels: cropper
Jquery Cropper
A jQuery plugin wrapper for Cropper.js.
Stars: ✭ 516 (+2245.45%)
Mutual labels: cropper
Vue Advanced Cropper
The advanced vue cropper library that gives you opportunity to create your own croppers suited for any website design
Stars: ✭ 281 (+1177.27%)
Mutual labels: cropper
Cc
一个基于angular5.0.0+ng-bootstrap1.0.0-beta.8+bootstrap4.0.0-beta.2+scss的后台管理系统界面(没基础的同学请先自学基础,谢谢!)
Stars: ✭ 416 (+1790.91%)
Mutual labels: cropper
Vue Cropper
A simple picture clipping plugin for vue
Stars: ✭ 3,170 (+14309.09%)
Mutual labels: cropper
Vue Avatar Cropper
👧 A simple and elegant avatar cropping and upload plugin.
Stars: ✭ 398 (+1709.09%)
Mutual labels: cropper
Android Image Cropper
Image Cropping Library for Android, optimized for Camera / Gallery.
Stars: ✭ 5,955 (+26968.18%)
Mutual labels: cropper
Cropme
Extremely Smooth and Easy Cropping library for you
Stars: ✭ 306 (+1290.91%)
Mutual labels: cropper
Tocropviewcontroller
A view controller for iOS that allows users to crop portions of UIImage objects
Stars: ✭ 4,210 (+19036.36%)
Mutual labels: cropper
angular-cropper
Touch-enabled image cropper for AngularJS
Get it
$ bower install angular-cropper
or
$ npm install angular-cropper
Use it
- Include files in your html
bower_components/angular-file-reader/angular-file-reader.js
bower_components/angular-cropper/angular-cropper.js
- Include
tw.directives.cropper
in your module dependenciesangular.module('myApp', ['tw.directives.cropper']);
- Place the
tw-cropper
attribute on a canvas<canvas width="300" height="300" tw-cropper="cropper"></canvas>
- Give your cropper a
source
<canvas width="300" height="300" tw-cropper="cropper" source="myFile"></canvas>
-
source
must be a File - See the demo for one way to get a File to your scope
- Or use twhitbeck/angular-file-input
- Get the dataURL of your crop with controller
toDataURL
method<button ng-click="upload(cropper.toDataURL())">Save</button>
- That's it!
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].