ArcGIS JS 4 Rotate Graphic

BobCowling2

I am attempting to rotate an arrow based on a mobile phones device orientation. However simply changing the symbol angle does not seem to work. What is the proper way to rotate a graphic? 

Thank you very much. 

 

const arrowSymbol = {
  type: "simple-marker",
  path: "M10,0 L20,30 L10,20 L0,30 Z",
  color: [0, 0, 255, 1],
  outline: {
    color: [0, 0, 0, 1],
    width: 1
  },
  size: 25
};


const arrowGraphic = new Graphic({
  symbol: arrowSymbol
});

const track = new Track({
  view: view,
  graphic: arrowGraphic,
  useHeadingEnabled: false
});


  // Add the Track widget to the view
  view.ui.add(track, "top-right");
   
  window.addEventListener("deviceorientation", (event) => {
  console.log(`${event.alpha} : ${event.beta} : ${event.gamma} : ${event.absolute} : ${event.webkitCompassHeading}`); 
  // get the heading value from the device
  const heading = event.alpha ? event.alpha * -1 : 0;

  // Rotate the arrow symbol based on the device's heading.
  arrowGraphic.symbol.angle = heading;

 

 

AndyGup

Hi @BobCowling2 we are working on similar functionality for the Track widget that is tentatively scheduled for the 4.27 release. I can post an update when that is available for testing on the 'next' build, or do you need something sooner than that?