RX100で撮り歩くブログ

RX100で撮った写真を中心によりよい生活を目指すブログ

【Three】ジオメトリ

ジオメトリを指定することで、立方体や球など様々なオブジェクトを表示できる。

球体、直方体、三角錐、ドーナツ状など基本的な形状がthree.jsで用意されている。

球体

threejs.org

SphereGeometry(radius : Float, widthSegments : Integer, heightSegments : Integer, phiStart : Float, phiLength : Float, thetaStart : Float, thetaLength : Float)

new THREE.SphereGeometry(半径, 経度分割数, 緯度分割数, 開始経度, 経線中心角, 開始緯度, 緯線中心角)

const geometry = new THREE.SphereGeometry(250, 32, 32)

立方体

threejs.org

BoxGeometry(width : Float, height : Float, depth : Float, widthSegments : Integer, heightSegments : Integer, depthSegments : Integer)

new THREE.BoxGeometry(幅, 高さ, 奥行き)

const geometry = new THREE.BoxGeometry(250, 250, 250)

平面

threejs.org

PlaneGeometry(width : Float, height : Float, widthSegments : Integer, heightSegments : Integer)

THREE.PlaneGeometry ( 幅, 高さ , 経度分割数, 緯度分割数)

const geometry = new THREE.PlaneGeometry(250, 250, 1, 1)

円柱

threejs.org

CylinderGeometry(radiusTop : Float, radiusBottom : Float, height : Float, radialSegments : Integer, heightSegments : Integer, openEnded : Boolean, thetaStart : Float, thetaLength : Float)

new THREE.CylinderGeometry(上面の半径, 底面の半径, 高さ,円周の分割数, 高さの分割数, フタ(true/false))

参考書

初めてのThree.js 第2版 ―WebGLのためのJavaScript 3Dライブラリ

初めてのThree.js 第2版 ―WebGLのためのJavaScript 3Dライブラリ

  • 作者:Jos Dirksen
  • 発売日: 2016/07/23
  • メディア: 単行本(ソフトカバー)