Canvas gets browser coordinates (VUE project demo, the rest is the same)

Introduction: When using canvas to get coordinates, different browser processing is different

getPosition (EV) {let      x, y      if (Ev.layerx | | ev.layerx = = = 0) {        = Ev.layerx
    = ev.layery      Elseif (ev.offsetx | | ev.offsetx = = 0)        {= Ev.offsetx         = ev.offsety      }      return  {x:x, y:y}}

The above code is to get the click coordinates, except ie6,7,8 is available,

Firefox uses Layerx and layery to replace OffsetX and offsety

Layerx/y gets the distance that the trigger point is relative to the upper-left corner of the DOM, and the value is the same as offsetx/y, which is the same as Firefox used to replace the offsetx/y, the base point is the upper-left corner of the border, but one condition is that The DOM that is triggered needs to be set to position:relative or Position:absolute, otherwise the distance from the upper-left corner of the relative HTML document area is returned

Compatibility: IE6/7/8 not supported, opera does not support, IE9/10 and Chrome, Safari support

Note: When using Layerx and Layery, be sure to position the triggered DOM settings, otherwise the coordinates will be biased.

Canvas gets browser coordinates (VUE project demo, the rest is the same)