Question

我已经在网页中实现了Photo Sphere Viewer，可以显示360张照片。我希望能够将项目拖到照片上，以便将标记放置在选定的协调位置。

我已经阅读了文档，没有提到“ ondrop”，我想知道是否可以从父div的ondrop外部调用“ click”事件？

我找不到任何支持此操作的文档，有人可以提供帮助吗？

谢谢

    <style>
      #viewer {
        width: 70vw;
        height: 70vh;
      }
    </style>    

    <img draggable="true" ondragstart="drag(event)"  src="/temp/asbestosicon.png" />


    <div id="viewer" style="box-shadow: 10px 10px 8px #888888;border-style:solid;border-color:black;border-width:thin;"></div>



<script>



  var viewer = new PhotoSphereViewer({
    container: 'viewer',
   time_anim: false,
   panorama: '/temp/9D01C2D0-EDC4-4B7B-BE39-478C83F2FACF.jpeg',
    usexmpdata: false

  ,
    markers: [
    {
      // image marker that opens the panel when clicked
      id: 'image',
      longitude: 0.5836051638081639,
      latitude: 0.0852476685705037,
      image: '/temp/asbestosicon.png',
      width: 32,
      height: 32,
      anchor: 'bottom center',
      tooltip: 'A image marker. <b>Click me!</b>',
      content: document.getElementById('someDiv').innerHTML
    }

    ]

    });

viewer.on('click', function(e) {
  viewer.addMarker({
    id: '#' + Math.random(),
    longitude: e.longitude,
    latitude: e.latitude,
    image: '/images/mapMarker.png',
    width: 32,
    height: 32,
    anchor: 'bottom center',
    tooltip: 'Generated pin',
    data: {
      generated: true
    }
  });


});

/**
 * Delete a generated marker when the user clicks on it
 */
viewer.on('select-marker', function(marker) {
  if (marker.data && marker.data.generated) {

    alert("Longitude:" + marker.longitude + " Latitude:" + marker.latitude);

  }
});


</script>

Photo Sphere Viewer发生放下事件

0 个答案: