2016-06-28 4 views
1

svg-pan-zoom 라이브러리 (https://github.com/ariutta/svg-pan-zoom)를 사용하며 Chrome과 Firefox 모두 내 사이트의 페이지에서 약 75 % 최신 버전).svg-pan-zoom이 작동하지 않습니다. 100 % 시간에

내 임기가 잘못되었다고 가정하기 때문에 오류가 발생했는지 또는 특정 시나리오가 원인인지 궁금합니다.

내 코드 :

(function (mw, $) { 

    $(document).ready(function() { 

     panZoomInstance = svgPanZoom('#stylometricanalysis-svg1', { 
      zoomEnabled: true, 
      controlIconsEnabled: true, 
      fit: true, 
      center: true, 
      minZoom: 0.1 
     }); 

     panZoomInstance = svgPanZoom('#stylometricanalysis-svg2', { 
      zoomEnabled: true, 
      controlIconsEnabled: true, 
      fit: true, 
      center: true, 
      minZoom: 0.1 
     }); 

    }); 

}(mediaWiki, jQuery)); 

오류 :

145 TypeError: this.options.svg.createSVGMatrix is not a function 

라이브러리 버전 : 3.2.9

<object class='stylometricanalysis-image' id='stylometricanalysis-svg1' type='image/svg+xml' data='/some/path/to/svg/file.svg'>Your browser does not support SVG files, and so your visualization cannot display</object> 

<object class='stylometricanalysis-image' id='stylometricanalysis-svg2' type='image/svg+xml' data='/some/path/to/svg/file.svg'>Your browser does not support SVG files, and so your visualization cannot display</object> 

답변

0

귀하의 SVG 콘텐츠는 동적으로로드됩니다. JS가 시작될 때가끔 SVG 콘텐츠를 사용할 수있는 경우가 있으며 때로는 그렇지 않을 수도 있음을 의미합니다. 그리고 그렇지 않은 경우 - 오류가 발생합니다.

SVG 내용이로드 된 후에 만 ​​svgPanZoom을 초기화해야합니다. 어떻게 할 수 있는지 보려면 this example with dynamic SVGs을 확인하십시오. 하지만 기본적으로 svgPanZoom을 초기화하기 전에 SVG가로드되었는지 확인해야합니다. 그렇지 않으면로드 이벤트를 수신합니다.

관련 문제