Three.js中Canvas纹理模糊但原Canvas清晰的问题求助

我现在碰到个棘手的问题：用Canvas作为纹理渲染Three.js平面的时候，平面上的Canvas纹理总是有点模糊，但单独显示的Canvas是清晰的，想请教各位大佬怎么解决这个问题？

以下是我用到的代码：

JavaScript代码 #

import * as THREE from "three";

const image = document.getElementById('origin-img')

/* --- draw 【canvas】 by image--- */
const canvas = document.getElementById('canvas')
canvas.width = image.width
canvas.height = image.height
const ctx = canvas.getContext('2d')
ctx.drawImage(image, 0, 0, image.width, image.height, 0, 0, image.width, image.height)

/* --- threejs scene --- */
const itemWidth = 300
const itemHeight = 300

const scene = new THREE.Scene();
const camera = new THREE.OrthographicCamera(itemWidth / -2, itemWidth / 2, itemHeight / 2, itemHeight / -2, 0, 1000);
camera.position.z = 100;

const renderer = new THREE.WebGLRenderer({
  canvas: document.getElementById('webgl')
});
renderer.setSize(itemWidth, itemHeight);

// create a plane which uses 【canvas】 as texture
const geometry = new THREE.PlaneGeometry(image.width, image.height, 64, 64);
const material = new THREE.MeshBasicMaterial({
  map: new THREE.CanvasTexture(
    canvas,
    THREE.Texture.DEFAULT_MAPPING,
    THREE.ClampToEdgeWrapping,
    THREE.ClampToEdgeWrapping,
    THREE.LinearFilter,
    THREE.LinearMipmapLinearFilter,
    THREE.RGBAFormat,
    THREE.UnsignedByteType,
    1
  )
});
const plane = new THREE.Mesh(geometry, material);
scene.add(plane);

renderer.render(scene, camera);

HTML代码 #

<div class="app" style="display: flex; justify-content: space-between; width: 1200px;">
  <div class="item-container">
    <div class="item">
      <img id='origin-img' src="./origin-texture.png">
    </div>
    <div class="caption">Origin Image</div>
  </div>
  <div class="item-container">
    <div class="item">
      <canvas id="canvas"></canvas>
    </div>
    <div class="caption">Draw canvas by image</div>
  </div>
  <div class="item-container">
    <div class="item">
      <canvas id="webgl"></canvas>
    </div>
    <div class="caption">In threejs, create a plane which uses canvas as a texture</div>
  </div>
</div>
<script type="module" src="./index.js"></script>

备注：内容来源于stack exchange，提问作者L_T