Trying to draw thick line using Line2 but can't access to material.resolution

Questions
1

I am following this tutorial, and I’m trying to draw a thick line based on different coordinates. google-maps-threejs/car.js at d5e498dd7a78b142f47d2f881d97171ff09c37b7 · leighhalliday/google-maps-threejs · GitHub

My code stuck in here

trackRef.current.material.resolution.copy(
  overlayRef.current.getViewportSize()
);

because there’s no ‘resolution’ in material. My code for thick line is this:

const lineGeometry = new LineGeometry().setPositions(positions);
const lineMaterial = new THREE.LineBasicMaterial({
  color: 0xff0000,
  linewidth: 8,
});
const line = new Line2(lineGeometry, lineMaterial);

How do I access to material.resolution or does anyone know any other way to achieve the same thing?

2

Try to use LineMaterial instead of LineBasicMaterial. See this example:

https://codepen.io/boytchev/full/MWPbLQy

2 Likes
3

Thank you! I’ll try that.