vue预览tiff图片

390 阅读1分钟

使用三方库tiff.js

下载库

yarn add tiff.js

使用

<template>
  <div class="base-image">
    <img
      ref="imgRef"
      :src="imgUrl">
  </div>
</template>


<script setup lang="ts">
import 'tiff.js'

if(res.data.type === 'image/tiff'){
  imgUrl.value = res.data
  try{
    res.data.arrayBuffer().then((arrayBuffer: any) => {
      // @ts-ignore 
      const tiff = new Tiff({
        buffer: arrayBuffer,
      });
      //转成png格式的base64图片,将其用img标签展示即可
      //console.log(tiff.toDataURL("image/png"))
      imgUrl.value = tiff.toDataURL("image/png")
    })
  }
  catch(e){
    console.log(e, 'error')
  }
  return
}