Calculate SVG absolute `transform-origin` position to be compatible with firefox

svg-transform-origin-absolute.js

var element = document.querySelector(prompt('Insert the querySelector to the svg element.', '#gear'));
var bbox = element.getBBox(),
    x = bbox.x,
    y = bbox.y,
    w = bbox.width,
    h = bbox.height
;

var result =
  'center center' + "\n" +
  (x + (w / 2)) + 'px ' +
  (y + (h / 2)) + 'px;' +
  "\n" +
  "\n" +
  'top left' + "\n" +
  x + 'px ' +
  y + 'px;' +
  "\n" +
  "\n" +
  'top right' + "\n" +
  (x + w) + 'px ' +
  y + 'px;' +
  "\n" +
  "\n" +
  'bottom right' + "\n" +
  (x + w) + 'px ' +
  (y + h) + 'px;' +
  "\n" +
  "\n" +
  'bottom left' + "\n" +
  x + 'px ' +
  (y + h) + 'px;' +
  "\n"
;

alert(result);

To use this:

• Open the SVG in the browser
• Create a bookmarklet or run this code on the console
• Put the querySelector to the SVG element
• Copy the value and paste in your css transform-origin