three-rounded-box

Box geometry for three.js with filleted edges

Usage no npm install needed!

<script type="module">
  import threeRoundedBox from 'https://cdn.skypack.dev/three-rounded-box';
</script>

README

three-rounded-box

stable

See it live.

A geometry class with filleted edges for THREE.js. Extends THREE.BufferGeometry.

Constructor

RoundedBoxGeometry( width , height , depth , radius , radiusSegments )

width = Float           //size of box in x axis, default 1
height = Float          //size of box in y axis, default 1
depth = Float           //size of box in z axis, default 1
radius = Float          //radius of the fillet,  default 0.15
radiusSegments = Int    //segments along the fillet, default 1

Usage

NPM


var RoundedBoxGeometry = require('three-rounded-box')(THREE); //pass your instance of three

var myBox = new THREE.Mesh( new RoundedBoxGeometry( 10 , 10 , 10 , 2 , 5 ) );

myScene.add(myBox);

Test

npm install
npm start

You should see a box with smooth edges spinning.

TODO

  • cleanup the weaving logic
  • add segments along the sides