├── .gitignore ├── LICENSE.md ├── README.md ├── index.js ├── package.json ├── render.png └── test └── index.js /.gitignore: -------------------------------------------------------------------------------- 1 | bower_components 2 | node_modules 3 | *.log 4 | .DS_Store 5 | bundle.js 6 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | Copyright (c) 2014 Mikko Haapoja 3 | 4 | Permission is hereby granted, free of charge, to any person obtaining a copy 5 | of this software and associated documentation files (the "Software"), to deal 6 | in the Software without restriction, including without limitation the rights 7 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 8 | copies of the Software, and to permit persons to whom the Software is 9 | furnished to do so, subject to the following conditions: 10 | 11 | The above copyright notice and this permission notice shall be included in all 12 | copies or substantial portions of the Software. 13 | 14 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 15 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 16 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 17 | IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, 18 | DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR 19 | OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE 20 | OR OTHER DEALINGS IN THE SOFTWARE. 21 | 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # geo-piecering 2 | 3 | ![render](./render.png) 4 | [![experimental](http://badges.github.io/stability-badges/dist/experimental.svg)](http://github.com/badges/stability-badges) 5 | 6 | Creates a ring cut into piece in 3d space. 7 | 8 | ## Usage 9 | 10 | [![NPM](https://nodei.co/npm/geo-piecering.png)](https://www.npmjs.com/package/geo-piecering) 11 | 12 | ### Example 13 | 14 | An example can be found at `./test/index.js`. You can run this test by calling: 15 | ``` 16 | $ npm test 17 | ``` 18 | 19 | A simple usage example with default values being passed as settings: 20 | ```javascript 21 | var geoPieceRing = require('geo-piecering'); 22 | 23 | // geo will be a Object will two properties: 24 | // positions - the vertices 25 | // cells - the indices to draw the piece ring 26 | var geo = geoPieceRing( { 27 | cellSize: 3, // 1 == points, 2 == lines, 3 == triangles 28 | x: 0, // x position of the center of the piece ring 29 | y: 0, // y position of the center of the piece ring 30 | z: 0 // z position of the center of the piece ring 31 | radius: 200, // the radius of the piece ring 32 | pieceSize: Math.PI * 0.15, // size of the pieces 33 | startRadian: 0, // radian to start drawing pieces from 34 | numPieces: 8, // how many pieces to place 35 | quadsPerPiece: 5, // how many times the piece is split 36 | height: 10, // the height of the ring 37 | drawOutline: true // if cellSize == 2 draw only the outside of the shape 38 | }); 39 | ``` 40 | 41 | ## License 42 | 43 | MIT, see [LICENSE.md](http://github.com/mikkoh/geo-piecering/blob/master/LICENSE.md) for details. 44 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | module.exports = geoPieceRing; 2 | 3 | function geoPieceRing(options) { 4 | 5 | var geo = { 6 | positions: [], 7 | cells: [] 8 | }; 9 | 10 | options = options || {}; 11 | options.cellSize = options.cellSize || 3; 12 | options.x = options.x || 0; 13 | options.y = options.y || 0; 14 | options.z = options.z || 0; 15 | options.radius = options.radius || 200; 16 | options.pieceSize = options.pieceSize || Math.PI * 0.15; 17 | options.startRadian = options.startRadian || 0; 18 | options.numPieces = options.numPieces || 8; 19 | options.quadsPerPiece = options.quadsPerPiece || 5; 20 | options.height = options.height || 10; 21 | options.drawOutline = options.drawOutline === undefined ? true : options.drawOutline; 22 | 23 | createGeometry(options, geo.positions, geo.cells); 24 | 25 | return geo; 26 | } 27 | 28 | function createGeometry(options, positions, cells) { 29 | 30 | var o = options; 31 | var pos = positions; 32 | var y = o.y; 33 | var halfHeight = o.height * 0.5; 34 | var radius = o.radius; 35 | var pieceSize = o.pieceSize; 36 | var numPieces = o.numPieces; 37 | var quadsPP = o.quadsPerPiece; 38 | var startRadian = o.startRadian; 39 | var radInc = (2 * Math.PI - ( numPieces * pieceSize )) / numPieces; 40 | var quadRadInc = pieceSize / quadsPP; 41 | var curRad = 0; 42 | var sIdx = 0; 43 | var x, z, x2, z2, r1, r2; 44 | 45 | for(var i = 0; i < numPieces; i++) { 46 | 47 | for(var j = 0; j < quadsPP; j++) { 48 | 49 | r1 = curRad + quadRadInc * j + startRadian; 50 | r2 = curRad + quadRadInc * (j + 1) + startRadian; 51 | 52 | x = Math.cos(r1) * radius + o.x; 53 | z = Math.sin(r1) * radius + o.z; 54 | x2 = Math.cos(r2) * radius + o.x; 55 | z2 = Math.sin(r2) * radius + o.z; 56 | 57 | pos.push([ x, y - halfHeight, z ]); 58 | pos.push([ x, y + halfHeight, z ]); 59 | pos.push([ x2, y + halfHeight, z2 ]); 60 | pos.push([ x2, y - halfHeight, z2 ]); 61 | 62 | //add in the cells 63 | if(o.cellSize == 1) { 64 | 65 | cells.push([ sIdx ]); 66 | cells.push([ sIdx + 1 ]); 67 | cells.push([ sIdx + 2 ]); 68 | cells.push([ sIdx + 3 ]); 69 | } else if(o.cellSize == 2) { 70 | 71 | // vertical lines 72 | if( !o.drawOutline ) { 73 | 74 | cells.push([ sIdx, sIdx + 1 ]); 75 | cells.push([ sIdx + 2, sIdx + 3 ]); 76 | } else if( j == 0 ) { 77 | 78 | cells.push([ sIdx, sIdx + 1 ]); 79 | } else if( j == quadsPP - 1 ) { 80 | 81 | cells.push([ sIdx + 2, sIdx + 3 ]); 82 | } 83 | 84 | // horizontal lines 85 | cells.push([ sIdx + 1, sIdx + 2 ]); 86 | cells.push([ sIdx + 3, sIdx ]); 87 | } else if(o.cellSize == 3) { 88 | 89 | cells.push([ sIdx, sIdx + 1, sIdx + 2 ]); 90 | cells.push([ sIdx, sIdx + 3, sIdx + 2 ]); 91 | } 92 | 93 | sIdx += 4; 94 | } 95 | 96 | curRad += radInc + pieceSize; 97 | } 98 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "geo-piecering", 3 | "version": "1.0.1", 4 | "description": "Creates a ring cut into piece in 3d space.", 5 | "main": "index.js", 6 | "license": "MIT", 7 | "author": { 8 | "name": "Mikko Haapoja", 9 | "email": "me@mikkoh.com", 10 | "url": "https://github.com/mikkoh" 11 | }, 12 | "dependencies": {}, 13 | "devDependencies": { 14 | "wzrd": "^1.2.1", 15 | "gl-geometry": "^1.0.3", 16 | "gl-matrix": "^2.1.0", 17 | "gl-now": "^1.4.0", 18 | "mesh-combine": "^1.1.0", 19 | "simple-3d-shader": "0.0.0" 20 | }, 21 | "scripts": { 22 | "test": "open http://localhost:9966 && wzrd test/index.js" 23 | }, 24 | "keywords": [ 25 | "ring,piece,geometry,generate,mesh,webgl,3d,model" 26 | ], 27 | "repository": { 28 | "type": "git", 29 | "url": "git://github.com/mikkoh/geo-piecering.git" 30 | }, 31 | "homepage": "https://github.com/mikkoh/geo-piecering", 32 | "bugs": { 33 | "url": "https://github.com/mikkoh/geo-piecering/issues" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /render.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/mikkoh/geo-piecering/fad2124b84717101b9611a6ad85ba1410a43a6d5/render.png -------------------------------------------------------------------------------- /test/index.js: -------------------------------------------------------------------------------- 1 | var shell = require('gl-now')( { 2 | 3 | clearColor: [ 1, 1, 1, 1 ] 4 | }); 5 | var simple3DShader = require('simple-3d-shader'); 6 | var createGeometry = require('gl-geometry'); 7 | var meshCombine = require('mesh-combine'); 8 | var mat4 = require('gl-matrix').mat4; 9 | var geoPieceRing = require('./..'); 10 | 11 | var rotation = 0; 12 | var cellSize = 2; 13 | var gl, geo, shader, model, projection, drawWith; 14 | 15 | 16 | shell.on( 'gl-init', function() { 17 | 18 | var allGeo = []; 19 | 20 | gl = shell.gl; 21 | 22 | switch( cellSize ) { 23 | 24 | case 1: 25 | drawWith = gl.POINTS; 26 | break; 27 | 28 | case 2: 29 | drawWith = gl.LINES; 30 | break; 31 | 32 | case 3: 33 | drawWith = gl.TRIANGLES; 34 | break; 35 | } 36 | 37 | allGeo.push(geoPieceRing( { 38 | cellSize: cellSize, 39 | height: 10, 40 | radius: 300 41 | })); 42 | 43 | allGeo.push(geoPieceRing( { 44 | cellSize: cellSize, 45 | y: 130, 46 | drawOutline: false, 47 | numPieces: 20, 48 | pieceSize: ( Math.PI * 2 ) * 1 / 50, 49 | height: 50 50 | })); 51 | 52 | allGeo.push(geoPieceRing( { 53 | cellSize: cellSize, 54 | y: -130, 55 | height: 100 56 | })); 57 | 58 | 59 | geo = meshCombine( allGeo ); 60 | 61 | shader = simple3DShader( gl ); 62 | 63 | mesh = createGeometry( gl ) 64 | .attr( 'positions', geo.positions ) 65 | .faces( geo.cells, { size: cellSize } ); 66 | }); 67 | 68 | shell.on( 'gl-render', function() { 69 | 70 | projection = mat4.create(); 71 | mat4.perspective( projection, Math.PI * 0.25, shell.width / shell.height, 0.1, 10000 ); 72 | 73 | model = mat4.create(); 74 | mat4.translate( model, model, [ 0, 0, -1000 ] ); 75 | mat4.rotateX( model, model, Math.PI * 0.1 ); 76 | mat4.rotateY( model, model, rotation += 0.005 ); 77 | 78 | shader.bind(); 79 | 80 | shader.uniforms.projection = projection; 81 | shader.uniforms.model = model; 82 | shader.uniforms.view = mat4.create(); 83 | 84 | shader.attributes.color = [ 0, 0, 0 ]; 85 | 86 | mesh.bind( shader ); 87 | mesh.draw( drawWith ); 88 | mesh.unbind(); 89 | }); 90 | --------------------------------------------------------------------------------