1.在HTML中嵌入SVG（我采用的是<embed>標簽嵌入）
<div class="wrapper wrapper-content">
<embed id="svg" src="~/Content/test.svg" class="show-style" onload="zoom(this)"/>
</div>
2.引入JS文件（svg-pan-zoom.js在文末github里下載）
<script src="~/Content/js/svg-pan-zoom.js"></script>
3.加入js腳本
<script type="text/javascript">
function zoom(obj) {
// 此處獲取的元素Id是SVG文件中的<g>標簽的id值
$(obj.getSVGDocument().getElementById('svg')).show();
svgPanZoom(obj, {
zoomEnabled: true, //開啟縮放功能
controlIconsEnabled: true //開啟右下角縮放控件功能
});
}
</script>
主要參考來源https://github.com/ariutta/svg-pan-zoom里面包含多種SVG圖布局以及顯示方式的Demo