Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/nikli2009/vue-img-orientation-changer
A vue plugin that can help you display image in correct orientation.
https://github.com/nikli2009/vue-img-orientation-changer
auto-orient image-exif image-orientation img-direction img-rotate img-rotation jpeg-orientation jpg-direction jpg-rotate jpg-rotation tiff-orientation vue vue-component vue-directive vue-image vue-jpeg vue-jpg vue-plugin vue-tiff
Last synced: about 2 months ago
JSON representation
A vue plugin that can help you display image in correct orientation.
- Host: GitHub
- URL: https://github.com/nikli2009/vue-img-orientation-changer
- Owner: nikli2009
- License: mit
- Created: 2019-01-17T06:50:14.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2019-01-21T12:34:30.000Z (over 5 years ago)
- Last Synced: 2024-01-24T06:44:55.516Z (4 months ago)
- Topics: auto-orient, image-exif, image-orientation, img-direction, img-rotate, img-rotation, jpeg-orientation, jpg-direction, jpg-rotate, jpg-rotation, tiff-orientation, vue, vue-component, vue-directive, vue-image, vue-jpeg, vue-jpg, vue-plugin, vue-tiff
- Language: JavaScript
- Size: 135 KB
- Stars: 39
- Watchers: 4
- Forks: 15
- Open Issues: 3
-
Metadata Files:
- Readme: README-zh_CN.md
- License: LICENSE
Lists
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (UI Components / Overlay)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (UI Components / Overlay)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
- awesome-vue - vue-img-orientation-changer ★58 - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (UI Components / Overlay)
- awesome-vue - vue-img-orientation-changer - A Vue.js `directive` that automatically adjust your `img` to correct `orientation`. (Components & Libraries / UI Components)
README
## Vue Img Orientation Changer
[English](./README.md) | 简体中文
[![NPM Version][npm-image]][npm-url]
[![NPM Downloads][downloads-image]][downloads-url]
> 一个 `Vue 指令(Directive)`, 可以自动调整手机设备拍摄的照片的`方向` 支持 `jpeg` `jpg` `tiff`
` TIPS: 再也不用歪着头看图了 `
### 安装
##### 通过 NPM
```
npm install vue-img-orientation-changer -S
```
##### 项目中引入
```
import Vue from 'vue'
import VueImgOrientationChanger from 'vue-img-orientation-changer'
Vue.use(VueImgOrientationChanger)
```
##### 使用方式
###### 在`img`元素上 加上 `v-img-orientation-changer`
```
```
` TIPS: 已经应用指令的图片元素 会有一个属性 [data-orientation]， 这个属性会获得 图片的exif信息中的orientation部分`
```
// 最终的DOM 结果如下：
// 代表这个图片的orientation 是 6， 可以参照一下上面的对照图
```
## 协议
[MIT](LICENSE)
[npm-image]: https://img.shields.io/npm/v/vue-img-orientation-changer.svg
[npm-url]: https://npmjs.org/package/vue-img-orientation-changer
[downloads-image]: https://img.shields.io/npm/dm/vue-img-orientation-changer.svg
[downloads-url]: https://npmjs.org/package/vue-img-orientation-changer