Upgrade from version 71

Questions
1

Hi,

I have the below project which uses THREE JS r71 with html/css 2D button navigation (thanks Mugen87 for the fix -> Adding navigation buttons) but there are issues on mobile (most notably Safari on iPhone) where the buttons move.

I tested with the new version of THREE JS r118 and this appears to work however I’m getting the following errors and the “neural network” doesn’t look the same:

  1. THREE.ShaderMaterial: attributes should now be defined in THREE.BufferGeometry instead.
  2. 32bit index buffer not supported!
  3. THREE.Line: parameter THREE.LinePieces no longer supported. Use THREE.LineSegments instead.

I’ve used the https://github.com/mrdoob/three.js/wiki/Migration-Guide and searches for fixes but as a newbie, I’m totally lost.

Could anyone assist or guide me in the right direction to fix this?

Screenshot 2020-07-06 at 10.42.37 PM
Screenshot 2020-07-06 at 10.42.37 PM1479×742 569 KB
Screenshot 2020-07-06 at 10.42.54 PM
Screenshot 2020-07-06 at 10.42.54 PM1451×753 647 KB

2

I had a quick look at your code and performing the upgrade is actually quite some work. Your particle system relies on THREE.Geometry although you have to develop it based on THREE.BufferGeometry. This is required since you have to move out the shader attributes definitions from ShaderMaterial to THREE.BufferGeometry (the first error of your list).

If you don’t have the time to implement this by yourself, I suggest you hire a three.js dev for one or two days in order to perform the upgrade.