svelte-panolensdeprecated

Svelte wrapper for Panolens

Usage no npm install needed!

<script type="module">
  import sveltePanolens from 'https://cdn.skypack.dev/svelte-panolens';
</script>

README

npm version MIT license PRs Welcome

svelte-panolens

This is very minimal wrapper for panolens.js
It's currently based on version 0.12.1 of panolens.js (see Caution).

Components

Currently the following components have been wrapped:

  • ImagePanorama
  • LittlePlanet
  • GoogleStreetviewPanorama

Install

   npm install svelte-panolens --save-dev

Configuration

The configuration if mostly mapped on the existing panolens.js config. The only exception is src which is used the provide the URL of the image you want to render.

The dimension are determined by the parent element.

Example

Live demo

<script>
    import { LittlePlanet } from 'svelte-panolens';
    const config = {
        src: '/example.jpg',
        controlBar: false,
        autoRotate: true
    };
</script>

<div class="main">
    <LittlePlanet {config} />
</div>

<style>
    .main {
        width: 700px;
        height: 350px;
    }
</style>

Developing

npm install
npm run dev

Caution

This module uses a modified version of panolens.js. The modifications are described here.