Как создать прямоугольную сетку SVG в качестве текстуры на сетке three.js

Question

Как создать прямоугольную сетку SVG в качестве textur на сетке three.js?Сетка может иметь динамический размер.Я хочу, чтобы текстура svg не растягивалась и сохраняла свой первоначальный размер.

Результат должен выглядеть так, как на этом рисунке]

.

Вотjsfiddle из моего текущего статуса: https://jsfiddle.net/s7vjkLon/6/

Как вы можете видеть, SVG (вверху слева) имеет размер 128 пикселей, а на сетке (внизу) SVG не отображается в своем первоначальном размере.Он растянут.

function init() {

  renderer = new THREE.WebGLRenderer();
  renderer.setSize(window.innerWidth, window.innerHeight);
  renderer.setClearColor(0xFFFFFF);
  document.body.appendChild(renderer.domElement);

  camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 1, 1000);
  camera.position.z = 500;

	scene = new THREE.Scene();
  scene.add(camera);

}

function animate() {
  requestAnimationFrame(animate);
  renderer.render(scene, camera);
}

function createGridOnMesh(options) {

	var space = options.space;
  var meshWidth = options.meshWidth;
  var meshHeight = options.meshHeight;
  var lineWidth = 2;

  var canvas = document.getElementById('canvas');
  canvas.width = Math.pow(2, 7);
  canvas.height = Math.pow(2, 7);

  var context = canvas.getContext('2d');
  context.fillStyle = "rgba(0, 0, 0, 1)";
  context.fillRect(0, 0, canvas.width, canvas.height);

  context.fillStyle = "rgba(255, 0, 0)";
  context.fillRect(Math.round(lineWidth / 2), Math.round(lineWidth / 2), canvas.width - lineWidth, canvas.height - lineWidth);

  var texture = new THREE.CanvasTexture(canvas);
  texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
  texture.repeat.set(2, 2);   
  texture.needsUpdate = true;
  
  geometry = new THREE.BoxBufferGeometry(meshWidth, meshHeight, 200);
  material = new THREE.MeshBasicMaterial({ map: texture });
  mesh = new THREE.Mesh(geometry, material);

  scene.add( mesh );  

}


init();
animate();
createGridOnMesh({ space: 20, meshWidth: 600, meshHeight: 200})

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/101/three.min.js"></script>
<canvas id="canvas"></canvas>

Заранее спасибо.