ionic-image-zoomer

Ionic Component to zoom images.

Usage no npm install needed!

<script type="module">
  import ionicImageZoomer from 'https://cdn.skypack.dev/ionic-image-zoomer';
</script>

README

npm npm npm

Ionic Image Zoomer

Ionic Module that enables pinching, panning and scaling images.

Installation

1. Install the NPM Package

npm install --save ionic-image-zoomer

3. Import IonicImageZoomer module

Add IonicImageZoomer.forRoot() in your app's root module

import { IonicImageZoomer } from 'ionic-image-zoomer';

// import the module
@NgModule({
  ...
  imports: [
    IonicImageZoomer.forRoot()
  ]
})
export class AppModule {}

Usage

Basic Usage

This HTML code demonstrates basic usage of this module:

<img-zoomer [src]="'https://path.to/my/image.jpg'"></img-loader>

This way the image takes the width or height of its parent container. If we want to set it a specific width or height, we can do it as follows:

<img-zoomer [src]="'https://path.to/my/image.jpg'" [width]="300px"></img-loader>

Contribution

  • Having an issue? or looking for support? Open an issue and we will get you the help you need.
  • Got a new feature or a bug fix? Fork the repo, make your changes, and submit a pull request.

Support this project

If you find this project useful, please star the repo to let people know that it's reliable. Also, share it with friends and colleagues that might find this useful as well. Thank you :smile: