标签: pannellum

我尝试在我的React组件中使用Pannellum NPM软件包。

Pannellum的API可以这样使用：

pannellum.viewer('panorama', {
    "type": "equirectangular",
    "panorama": "https://pannellum.org/images/alma.jpg"
});

我认为以下代码：

import React, { Component } from 'react';
import './App.css';
import pannellum from 'pannellum';

class App extends Component {

  componentDidMount() {
    pannellum.viewer('panorama', {
      "type": "equirectangular",
      "panorama": "https://pannellum.org/images/alma.jpg"
    });
  }

  render() {
    return (
      <div id="panorama"></div>
    );    
  }
}

export default App;

会工作。但是事实并非如此。我懂了TypeError: __WEBPACK_IMPORTED_MODULE_2_pannellum___default.a.viewer is not a function。

还尝试了另一个不同的import语句： import { pannellum } from 'pannellum';，const pannellum = require('pannellum');但是这些也不起作用。

有趣的是，Pannellum的API javascript代码已捆绑在一起，一旦我注释掉componentDidMount()并在页面加载后尝试通过Chrome Dev Tools控制台使用该API，它就可以工作。但是，没有应用CSS样式。 …

我正在尝试与Pannellum合作，在这种情况下，我如何获得热点俯仰和偏航功能。

"pitch":8,
"yaw": 20,
"cssClass": "custom-hotspot2",
"clickHandlerFunc": clickHandlerBox2,

我想在下面的函数Itried beloow函数中获得该音调和偏航（8和20）

function clickHandlerBox2(hotSpotDiv, args) {
var pitch=viewer.getPitch();
var yaw=viewer.getYaw();
}

但这是根据Pannellum观看者的运动提供动态数据。如何获得与上述完全相同的俯仰和偏航？