# agt360image-view

> 360 image view for Angular

Latest version **0.0.14** (published 2025-08-08) · MIT license · 0 weekly downloads

## Install

```sh
npm install agt360image-view
pnpm add agt360image-view
yarn add agt360image-view
bun add agt360image-view
```

## Health

**Score 35/100 (D)** — status: maintenance-mode.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: stale; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.14 |
| Published | 2025-08-08 |
| First published | 2024-12-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 32.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Aswinth GT |
| Maintainers | aswinth37 |
| Keywords | Angular, Angular 360, 360, image, view, 360 image view, 360 image viewer, Angular 360 image view, angular 360 view, Angular rotate image, 360 Image show, 360 Angular |

## Links

- npm: https://www.npmjs.com/package/agt360image-view
- Repository: https://github.com/Aswinthgt/agt360image
- Homepage: https://github.com/Aswinthgt/agt360image#readme
- Issues: https://github.com/Aswinthgt/agt360image/issues
- npm.io page: https://npm.io/package/agt360image-view

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) >=2.3.0

## Alternatives

- [exif-parser](https://npm.io/package/exif-parser.md) — 3.8M weekly downloads
- [vite-plugin-compression](https://npm.io/package/vite-plugin-compression.md) — 569.5K weekly downloads
- [pica](https://npm.io/package/pica.md) — 442.4K weekly downloads
- [@reportportal/client-javascript](https://npm.io/package/@reportportal/client-javascript.md) — 408.8K weekly downloads
- [@tldraw/state](https://npm.io/package/@tldraw/state.md) — 316.0K weekly downloads

## Recent versions

- 0.0.14 (latest) — 2025-08-08
- 0.0.13 — 2025-02-16
- 0.0.12 — 2025-02-16
- 0.0.11 — 2024-12-12

## README

# 360 Image View for Angular

An Angular component for displaying and interacting with 360-degree images.

## 🆕 What's New in v20.x.x
### Fixes & Improvements:
- ✅ **Updated Angular Compatibility:** Now supports **Angular v20.x.x**.

### Demo

Check out the live demo: [360view-demo](https://360view-demo.vercel.app/)

## Dependencies

version available for Angular

| agt360image-view | Angular     |
| ---------------- | ----------- |
| 0.0.11           | 19.x        |
| 0.0.12           | 19.x        |
| 0.0.13           | 19.x        |
| 0.0.14           | 20.x        |

## Installation

Install the package using npm:

```bash or powershell```
npm install agt360image-view.

## Setup

**step 1:** Import component

```typescript
import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterOutlet } from '@angular/router';
import { Agt360imageViewComponent } from 'agt360image-view';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [Agt360imageViewComponent],
  templateUrl: './app.component.html',
  styleUrl: './app.component.scss'
})
export class AppComponent {}
```

**step 2:** Define properties

``` typescript
import { Component } from '@angular/core';
import { Agt360imageViewComponent, RotateImage } from 'agt360image-view';  // Import 

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [Agt360imageViewComponent],
  templateUrl: './app.component.html',
  styleUrl: './app.component.scss'
})
export class AppComponent {

  src = '../assets/pro2.jpg'
  width = 700;
  height = 500;
  autoroatate: RotateImage= {    // Optional
    isRotate: true,
    rotateSpeed: 0.5
  };
 
}

```

**step 3:** Assign values

```html
<agt360image-view
  [src]="src"
  [width]="width"
  [height]="height"
  [autoRotate]="autoroatate"
  [enableFullScreen]="true"
></agt360image-view>
```

## Mandatory Fields

| property         | required    |
| ---------------- | ----------- |
| src              | true        |
| width            | true        |
| height           | true        |
| autoRotate       | optional    |
| enableFullScreen | optional    |


## License

MIT

---

> GitHub [@Aswinthgt](https://github.com/Aswinthgt)

---
_Source: https://npm.io/package/agt360image-view · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._