0

私はコーディングの経験があまりなく、要素に埋め込まれた SVG をユーザーがある程度制御できるようにしようとしています。ariutta svgpanzoom.js ライブラリを見つけましたが、それで小さなテストを作成しようとすると、chrome でセキュリティ エラーが発生します (Firefox と Safari ではすべて正常に動作します)。

これが私の基本的なコードです

  
<!DOCTYPE html>
<html>
<head>
	<title>SVG test</title>
	<meta charset="utf-8">
	<script src="http://ariutta.github.io/svg-pan-zoom/dist/svg-pan-zoom.js"></script>
</head>
<body>
	<p><h1>Test SVG in object tag</h1></p>
	<br>
	<object id="mySVG" type="image/svg+xml" data="../Tests/simpleSVG.svg" width="400" height="400" style="border: 1px solid red;"></object>
	
	<script>
      window.onload = function() {
        svgPanZoom("#mySVG", {
          zoomEnabled: true,
          controlIconsEnabled: true
        });
      };
    </script>

</body>
</html>

Chrome で発生するエラー: Uncaught SecurityError: Failed to read the 'contentDocument' property from 'HTMLObjectElement': Blocked a frame with origin "null" from a frame with origin "null". プロトコル、ドメイン、およびポートが一致する必要があります。

誰かが私が間違ったことを知っていますか?

前もって感謝します...

4

1 に答える 1