Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How to use photo-sphere-viewer plugins in vue project

See original GitHub issue

Hello Dear

Thank you! I have found answer in issue #368. Thank you all the same.

I used the photo-sphere-viewer 4.0.5 version in vue project. Now I have met a strange problem. I used like this completely copying from guide . html is as below:

<div id="viewer"></div>

js part is as:

import * as PSV from 'photo-sphere-viewer';
import 'photo-sphere-viewer/dist/photo-sphere-viewer.css';

export default {
  mounted() {
    this.initPhotoSphere();
  },
  methods: {
    initPhotoSphere() {
      const viewer = new PSV.Viewer({
        container: document.getElementById('viewer'),
        // panorama: this.factoryLink,
        panorama: 'https://photo-sphere-viewer.js.org/assets/sphere.jpg',
        size: {
          width: '100%',
          height: screen.availHeight,
        },
        loadingImg: 'https://photo-sphere-viewer.js.org/assets/photosphere-logo.gif',
        caption: '街景图',
        defaultLat: 0.3,
        plugins: [
          [PSV.MarkersPlugin, {
            markers: [ 
              {
                id: 'new-marker',
                longitude: '45deg',
                latitude: '0deg',
                image: 'https://photo-sphere-viewer.js.org/assets/pin-red.png',
              },
            ],
          }] 
        ],
      });
      console.log(viewer);
    }
  }
}

But in my last console.log, I can not find the plugins in viewer.

I trace in the photo-sphere-view source code. I print ‘plugins’ in ‘photo-sphere-viewer.js’ line 3200, I got a result of

 [undefined, {markers: Array(1)}]

I think maybe the undefined in the 0 index cause the problem. But I don’t know why it will add the undefined in the first. Then I changed to other plugins, the problem is the same. Hoping for your professional explanations. Thank you for your help!