All Projects → nikli2009 → vue-img-orientation-changer

nikli2009 / vue-img-orientation-changer

Licence: MIT license
A vue plugin that can help you display image in correct orientation.

Programming Languages

javascript
184084 projects - #8 most used programming language
Vue
7211 projects
HTML
75241 projects

Projects that are alternatives of or similar to vue-img-orientation-changer

vue-drag-zone
Drag Zone component for @vuejs
Stars: ✭ 127 (+234.21%)
Mutual labels:  vue-plugin, vue-component, vue-directive
Vue Quill Editor
🍡@quilljs editor component for @vuejs
Stars: ✭ 6,874 (+17989.47%)
Mutual labels:  vue-plugin, vue-component, vue-directive
Vue Awesome Swiper
🏆 Swiper component for @vuejs
Stars: ✭ 12,072 (+31668.42%)
Mutual labels:  vue-plugin, vue-component, vue-directive
Vue Codemirror
⌨️ @codemirror component for @vuejs
Stars: ✭ 2,115 (+5465.79%)
Mutual labels:  vue-plugin, vue-component, vue-directive
v-tostini
Toast plugin for Vue.js 2.x
Stars: ✭ 12 (-68.42%)
Mutual labels:  vue-plugin, vue-component
shadow
Shadow dom support for Vue
Stars: ✭ 46 (+21.05%)
Mutual labels:  vue-component, vue-directive
Navscroll Js
Lightweight package for highlighting menu items as you scroll the page, also scrolling to target section when item clicked. Use as a vue component/directive or in vanilla js.
Stars: ✭ 41 (+7.89%)
Mutual labels:  vue-component, vue-directive
Vue Easy Slider
Slider Component of Vue.js.
Stars: ✭ 313 (+723.68%)
Mutual labels:  vue-plugin, vue-directive
Vue Touch Ripple
👆 Touch ripple component for @vuejs
Stars: ✭ 443 (+1065.79%)
Mutual labels:  vue-plugin, vue-component
Vue Qrcode Reader
A set of Vue.js components for detecting and decoding QR codes.
Stars: ✭ 1,240 (+3163.16%)
Mutual labels:  vue-plugin, vue-component
Vue Js Toggle Button
🍥 Vue.js 2 toggle / switch button - simple, pretty, customizable
Stars: ✭ 836 (+2100%)
Mutual labels:  vue-plugin, vue-component
Vue Toastr
Vuejs Toast : Plugin and Component Capability.
Stars: ✭ 93 (+144.74%)
Mutual labels:  vue-plugin, vue-component
Vue Core Image Upload
a vue plugin for image to crop and upload
Stars: ✭ 1,321 (+3376.32%)
Mutual labels:  vue-plugin, vue-component
vuejs-countdown-timer
⏱ Vue 2 event countdown and timer component
Stars: ✭ 47 (+23.68%)
Mutual labels:  vue-component
vue-bus
Tiny simple central event bus plugin for Vue.js
Stars: ✭ 50 (+31.58%)
Mutual labels:  vue-plugin
vue-list-picker
Just a simple list picker component made with Vue.js (works with Vue 2 & 3)
Stars: ✭ 14 (-63.16%)
Mutual labels:  vue-component
vue-json-tree
Vue component that renders JSON data in a collapsible tree structure.
Stars: ✭ 48 (+26.32%)
Mutual labels:  vue-component
xcrop
Mobile image cropping component - Vue React 移动端裁剪组件
Stars: ✭ 27 (-28.95%)
Mutual labels:  vue-component
generator-vue-plugin
Yeoman generator generating vue plugin 🚀
Stars: ✭ 29 (-23.68%)
Mutual labels:  vue-plugin
vue-inview
vue-plugin for in-view package
Stars: ✭ 100 (+163.16%)
Mutual labels:  vue-plugin

Vue Img Orientation Changer

English | 简体中文

NPM Version NPM Downloads

A vue directive that fixes your jpeg jpg tiff files orientation.

TIPS: This can really help you stay away from neck damages.

image

Installation

Via NPM
npm install vue-img-orientation-changer -S
Import
import Vue from 'vue'
import VueImgOrientationChanger from 'vue-img-orientation-changer'

Vue.use(VueImgOrientationChanger)
Usage
add v-img-orientation-changer on your img element.
<img v-img-orientation-changer src="https://user-images.githubusercontent.com/10917606/51309472-735aa580-1a7f-11e9-8081-67ced9a3f536.jpeg">

TIPS: attribute [data-orientation] of the img element will be set with value of img's exif orientation.

// final DOM is like below
// means this img orientation is 6;
<img data-orientation="6" src="https://user-images.githubusercontent.com/10917606/51309472-735aa580-1a7f-11e9-8081-67ced9a3f536.jpeg">

LICENSE

MIT

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].