import * as THREE from "three";
import gotoPic from "@/assets/image/arrow.svg";
const m = new THREE.MeshBasicMaterial({
  map: new THREE.TextureLoader().load(gotoPic),
  color: 0xe44d54,
  transparent: true,
});

export default class Marker extends THREE.Mesh {
  constructor(startPoint, imageId) {
    const g = new THREE.PlaneGeometry(0.15, 0.15);
    g.rotateX(-Math.PI / 2);
    super(g, m);
    const a = startPoint.clone();
    this.position.copy(a);

    this.rotation.y = 0;
    this.position.y = 5;
    this.position.z -= 0.02;
    this.userData = {
      imageId: imageId || null,
      point: a.toArray(),
    };
    this.visible = true;
    this.scale.set(1, 1, 1);
    this.position.y += 0.5;
    this.name = "marker_" + this.uuid;
    this.renderOrder = 1000;
    // console.log(this, this.position);
  }
}
