mistic100 / Photo-Sphere-Viewer

A JavaScript library to display 360° sphere panoramas.
https://photo-sphere-viewer.js.org
MIT License
1.89k stars 681 forks source link

Marker Rotation is set to zero when updating marker position #1292

Closed Rai-Rai closed 5 months ago

Rai-Rai commented 5 months ago

Describe the bug

I'm updating the position of a marker (In reality via Drag'nDrop but I've changed this to the select-marker event for this bug report). The rotation of the marker is lost if the position is updated. This happens also if the tooltip is updated. (Not tested with other attributes)

Generate Marker:

createMarker() {
    const newMarker: MarkerConfig = {
      id: guid(),
      position: this.viewer.getPosition(),
      image: 'https://fonts.gstatic.com/s/i/materialiconsoutlined/arrow_circle_right/v2/24px.svg',
      size: {width: 90, height: 90},
      rotation: '90deg',
      anchor: 'center center',
      tooltip: 'Generated pin Generated pin Generated pin Generated pin Generated pin Generated pin Generated pin Generated pin Generated pin ',
      data: {
        generated: true,
      },
    }
    this.addMarker(newMarker);
  }

private addMarker(marker: MarkerConfig) {
    this.markersPlugin.addMarker(marker);
  }

changing the position by click on the marker

this.markersPlugin.addEventListener('select-marker', ({marker, doubleClick, rightClick}) => {

      const intersect = this.viewer.dataHelper.viewerCoordsToVector3({x: 100, y: 100})
      const newMarkerPosition = this.viewer.dataHelper.vector3ToSphericalCoords(intersect);

      //rotation before update
      console.log("rotation before updating Marker: ", this.markersPlugin.getMarker(marker.id).config.rotation);

      //rotation is lost
      this.markersPlugin.updateMarker({id: marker.id, position: newMarkerPosition});
      // this.markersPlugin.updateMarker({id: marker.id, tooltip: 'hello'});

      //this would (of course) keep the rotation
      // this.markersPlugin.updateMarker({id: marker.id, position: newMarkerPosition, rotation: marker.config.rotation});

      //rotation after update
      console.log("rotation after updating Marker: ", this.markersPlugin.getMarker(marker.id).config.rotation);

}

console output:

rotation before updating Marker:  1.5707963267948966
rotation after updating Marker:  0

I assume that the problem is caused here after merging the two configs: https://github.com/mistic100/Photo-Sphere-Viewer/blob/962331f3325010fb98493ba501450a43cec1a4f8/packages/markers-plugin/src/markers/Marker.ts#L163

since I don't see the warning of the try-catch block in my console it's likely already ending on L164 with the IF

The whole thing is done with:

Online demo URL

https://codesandbox.io/p/devbox/optimistic-https-gqs3n6?file=%2Fsrc%2Fapp%2Fapp.component.ts

Photo Sphere Viewer version

5.7.2

Plugins loaded

Markers Plugin

OS & browser

Win/Chrome

Additional context

No response

mistic100 commented 5 months ago

thank you for the complete analysis :)

github-actions[bot] commented 5 months ago

This feature/bug fix has been released in version 5.7.3.

Rai-Rai commented 5 months ago

Thank you, works great.