Web Dev Solutions

Catalin Mititiuc

aboutsummaryrefslogtreecommitdiff
blob: 5e9a2e40d5e993d743eb8e20a8aa3f5a35ca2b72 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
import zoom from './modules/zoom';
import pan from './modules/pan';

const optionalZoomFactor = 0.1
  //, object = document.querySelector('object')
  ;

// If embedding an SVG using an <object> tag, it's necessary to wait until the
// page has loaded before querying its `contentDocument`, otherwise it will be
// `null`.

window.addEventListener('load', function () {
  const svg = document.querySelector('svg'),
    targetEl = svg.querySelector('g.pan-zoom'),
    //pointer = svg.querySelector('#pointer'),
    options = { passive: false };

  svg.addEventListener('wheel', zoom(targetEl, optionalZoomFactor), options);
  svg.addEventListener('pointerdown', pan(targetEl), options);

  //svg.addEventListener('pointermove', e => {
  //  const pt = new DOMPoint(e.clientX, e.clientY),
  //    svgP = pt.matrixTransform(targetEl.getScreenCTM().inverse());
  //
  //  pointer.setAttributeNS(null, 'cx', svgP.x);
  //  pointer.setAttributeNS(null, 'cy', svgP.y);
  //});
});