Q:

why zoom in and zoom out not working first time in react js?

Could you please tell me why zoom in and zoom out button not working first time.when I click button  first time it not zoom in and not zoom out why ?
Here is my code
https://codesandbox.io/s/o4o98kwy0y
zoomIn = () => {
  console.log("zoom in");
  const { currentAngle, currentScale, zoomDelta } = this.state;
  const c = currentScale + zoomDelta;
  this.setState(state => ({
    ...state,
    currentScale: c
  }));
  this.drawImage();
};

zoomOut = () => {
  console.log("zoom in");
  const { currentAngle, currentScale, zoomDelta } = this.state;
  const c = currentScale - zoomDelta;
  this.setState(state => ({
    ...state,
    currentScale: c
  }));
  this.drawImage();
};

A:

It is because you are setting state and immediately drawing the image,
What you need is setState callback, Here is an example of it
zoomOut = () => {
  console.log("zoom in");
  const { currentAngle, currentScale, zoomDelta } = this.state;
  const c = currentScale - zoomDelta;
  this.setState(state => ({
    ...state,
    currentScale: c
  }), () => {
    this.drawImage();
  });
};

Updated code in your link

