vue项目里拖放svg图
- 安装vue-svg-pan-zoom 组件
方式1、执行 npm install --save vue-svg-pan-zoom
方式2、执行 cnpm install vue-svg-pan-zoom
2.页面代码
<template> <div> <SvgPanZoom class="" style="width: 100%; height: 80vh" :zoomEnabled="true" :controlIconsEnabled="false" :fit="false" :center="false" > <svg id="streetlampSvg" data-name="图层 1" class="ludeng_1" style=" position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); " xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3051.39 1319.85" > .........//svg代码 </svg> </SvgPanZoom> </div> </template> import SvgPanZoom from "vue-svg-pan-zoom"; components: { SvgPanZoom }, //控件声明