flywin8 / vue-svgreader

这是一个基于VUE的SVG文件阅读器插件，实现自定义水印、自定义尺寸、放大、缩小、滚动、翻页、全屏等功能

vue-svgreader

这是一个基于 VUE 的 SVG 文件阅读器插件，实现自定义水印、自定义尺寸、放大、缩小、滚动、翻页、全屏等功能

##有问题反馈 在使用中有任何问题，欢迎反馈给我，可以用以下联系方式跟我交流

• 德通电气
• 邮件：(flywin#vip.qq.com, 把#换成@)
• QQ: 2229390
• github: vue-svgreader.

使用说明

安装组件

npm install vue-svgreader

在组件中使用

import SvgReader from 'vue-svgreader'
export default {
  components: {
    SvgReader
  },
  data() {
    return {
      viewers: {
        txt: '水印文字',
        width: '700px', // 阅读器宽度默认860px(支持百分比)
        height: '500px', // 阅读器高度默认700px(支持百分比)
        showFullscreen: true, // 是否显示全屏按钮
        showZoom: true, // 是否显示放大缩小按钮
        innerZoom: false, // 是否进行内部缩放
        defaultZoom: false, // 默认不可以缩小(false表示默认可以缩小)
        defaultLoadPage: 3, // 默认加载中页数是3
        nextloadPage: 3, // 每次点击继续浏览加载页数是3
        files: [
          require('./assets/1.svg'),
          require('./assets/2.svg'),
          require('./assets/3.svg'),
          require('./assets/4.svg')
        ]
      }
    }
  }
}

全局注册组件

import SvgReader from 'vue-svgreader'
Vue.use(SvgReader)

在组件中使用

<template>
  <div id="app">
    <svg-reader :viewers="viewers"></svg-reader>
  </div>
</template>