https://github.com/robjtede/img-exif
A dependency-free vanilla web component that correctly orients images based on their EXIF data
https://github.com/robjtede/img-exif
exif html img javascript web-components
Last synced: 2 months ago
JSON representation
A dependency-free vanilla web component that correctly orients images based on their EXIF data
- Host: GitHub
- URL: https://github.com/robjtede/img-exif
- Owner: robjtede
- License: mit
- Created: 2017-04-17T14:58:15.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2018-12-12T00:40:44.000Z (over 7 years ago)
- Last Synced: 2025-03-15T13:37:52.060Z (over 1 year ago)
- Topics: exif, html, img, javascript, web-components
- Language: JavaScript
- Homepage:
- Size: 68.4 KB
- Stars: 1
- Watchers: 2
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# <img-exif>
> This vanilla web component simply takes a `src` attribute like the standard `img` element and renders it in it's correct orientation using any embedded EXIF data.
>
> Note: This component only works for **same-origin images** or **images with cross-origin headers**!
>
> `img-exif` has **no dependencies** (but may require a polyfill).
## Install
Install `img-exif` with your preferred node package manager.
```sh
$ yarn add img-exif
or
$ npm install --save img-exif
```
You will need to include any polyfills for browsers that do not support the Web Components v1 spec. See [https://github.com/webcomponents/webcomponentsjs](https://github.com/webcomponents/webcomponentsjs).
## Usage
Import the HTML file in the ``.
With Package Manager: please refer to [installing](#install)
```html
```
Without npm for managing web component packages
```html
```
Use the tag on your page.
```html
```
## Options
| Attribute | Type | Default | Description |
|:----------|:------|:--------|:-----------------------|
| `src` | *url* | | Same as `![]()
` |
## Limitations
- No option to use `height=` or `width=` attributes. Use CSS `width:` and `height:` properties instead.
## History
For changelog, [see releases.](https://github.com/robjtede/img-exif/releases)
## License
[MIT License](https://github.com/robjtede/img-exif/blob/master/LICENSE.md)