Giter VIP home page Giter VIP logo

voxel-engine's Introduction

voxel-engine

A voxel engine in javascript using three.js

Learn more at http://voxeljs.com

hello world template repo: http://github.com/maxogden/voxel-hello-world

example

var createGame = require('voxel-engine')
var game = createGame()
game.appendTo(document.body)

contributing

voxel-engine is an OPEN Open Source Project. This means that:

Individuals making significant and valuable contributions are given commit-access to the project to contribute as they see fit. This project is more like an open wiki than a standard guarded open source project.

See the CONTRIBUTING.md file for more details.

contributors

multiplex is only possible due to the excellent work of the following contributors:

Max OgdenGitHub/maxogdenTwitter/@maxogden
KumavisGitHub/kumavis
DeathcapGitHub/deathcap

API

require('voxel-engine')(options)

Returns a new game instance. options defaults to:

{
  texturePath: './textures/',
  generate: function(x,y,z) {
    return x*x+y*y+z*z <= 15*15 ? 1 : 0 // sphere world
  },
  materials: [['grass', 'dirt', 'grass_dirt'], 'brick', 'dirt'],
  materialFlatColor: false,
  chunkSize: 32,
  chunkDistance: 2,
  worldOrigin: [0, 0, 0],
  controls: { discreteFire: false },
  lightsDisabled: false,
  fogDisabled: false,
  generateChunks: true,
  mesher: voxel.meshers.culled,
  playerHeight: 1.62
}

Defaults

Player Size

Default 'player size' is a 1/2 block long/wide and 1.5 blocks high:

game.playerAABB().width() // => 12.5
game.playerAABB().height() // => 37.5

See implementation of Game.prototype.playerAABB for more details.

Terminology

  • block/voxel/cube -> mostly interchangeable. The minecrafty blocks you see on the screen.
  • chunk: is a piece of the world that contains voxels. try to pretend that these don't exist
  • AABB: bounding volume
  • voxeljs: not 100% consistent yet, 'voxel.js' also acceptable, but definitely not 'VoxelJS'.
  • dims: short for 'dimensions'. Perhaps obvious to some.
  • yaw: rotation around the vertical axis.
  • pitch: rotation around a horizontal axis.

Positions

  • x, z: horizontal plane
  • y: vertical plane

We try to always use arrays to represent vectors (aka positions)

  • [x, y, z]

Sometimes you may also see objects used, e.g. {x: 0, y: 0, z: 0}, this is because three.js uses objects for vectors.

Generating voxel worlds

Worlds have many chunks and chunks have many voxels. Chunks are cube shaped and are chunkSize x/y/z (default 32/32/32 - 32768 voxels per chunk). When the game starts it takes the worldOrigin and generates chunkDistance chunks in every x/y/z dimension (chunkDistance default of 2 means the game will render 2 chunks behind you, 2 in front etc for a total of 16 chunks.).

There is one major coordinate system in voxel.js: "game coordinates" (aka world coordinates)

  • every object added to a three.js scene gets a x/y/z position in game coordinates. in voxel-engine 1 game coordinate is the width of 1 voxel. when generating the world or interacting with individual voxels you can refer to voxels by coordinates. an example coordinate might be [34, -50, 302] which would mean starting from the worldOrigin 34 voxels over, 50 down and 302 forward

There are also some other less used coordinate systems that you should be aware of:

  • chunk coordinates: logically the same as voxel coordinates but for chunks. you probably won't need to use these as they are just used internally for rendering the world but it is good to know they exist.
  • local object coordinates: when you add items and other things to the game that aren't voxel terrain you introduce a new relative coordinate system inside each thing. so if you add a player 3d model body and you want to put a hat on the body you could position the hat relative to the body coordinates, etc

When you create a game you can also pass functions that the game will ask for voxel data. Here is an example generate function that makes a randomly textured cube world with a diameter of 20 voxels:

function generator(x, y, z) {
  if (x*x + y*y + z*z > 20*20) return 0
  return Math.floor(Math.random() * 4) + 1
}

The generate function will be called once for each voxel in the world. x, y and z will be values in game coordinates.

Generate a flat world 1 block high

Flat world is a nicer way to start (at least you can't fall off the edge). This places the player just above the ground.

var game = createGame({
  generate: function(x, y, z) {
    return y === 1 ? 1 : 0
  }
})

Interacting with the voxel world

Get current player position

game.controls.target().avatar.position()

This returns a THREE.js Vector3 object (which just means an object with 'x', 'y', and 'z').

Toggle a block on/off

game.setBlock(pos, 0) // off
game.setBlock(pos, 1) // on
game.setBlock(pos, 2) // on, with another material

Get the chunk at some world coordinates:

gameInstance.voxels.chunkAtPosition(position)

Get the voxel coordinates at some position (relative to that voxels chunk):

gameInstance.voxels.voxelVector(position)

Create a brand new voxel at some position.

Intended for use in first player contexts as it checks if a player is standing in the way of the new voxel. If you don't care about that then just use setBlock:

gameInstance.createBlock(pos, val)

val can be 0 or you can also use any single digit integer 0-9. These correspond to the materials array that you pass in to the game.

Set the value of a voxel at some position:

gameInstance.setBlock(pos, val)

Get the value of a voxel at some position:

gameInstance.getBlock(pos)

If you wanna see the lower level API for voxel data manipulation look at chunker.js inside the voxel module.

Raycast

shoots a ray and collides with voxels

gameInstance.raycastVoxels(start, position, distance)

if you just type gameInstance.raycastVoxels() it will default to using the current main camera position and direction, and default distance of 10, and epsilon of 1e-8

you will get back an object with the precise position, voxel position, direction, face normal and voxel value of the voxel that you intersected, or false if there was no collision

Create a new voxel adjacent to an existing voxel

first do a .raycastVoxels() then do gameInstance.createAdjacent(raycastResults, materialIndex)

Game events

There are a number of events you can listen to once you've instantiated a game. we use the node.js event emitter library which uses the following syntax for subscribing:

emitter.on('eventname', function(arg1, arg2, etc) {})

game.on('mouseup', function(pos) {}), game.on('mousedown', function(pos) {})

Captures mouse activity. pos is the game coordinate of the intersection of the voxel that you clicked on (if any)

game.on('tick', function(delta) {})

emits every time the game renders (usually no more than 60 times a second). delta is the time in milliseconds between this render and the last render

game.on('collision', function(item) {})

Called every tick when an item is colliding with the player. Callback is passed the item that is colliding.

game.voxelRegion.on('change', function(pos) {})

emits when you move between voxels. pos has x, y, and z voxel coordinates of the voxel you just entered

`game.chunkRegion.on('change', function(pos) {})``

emits when you move between chunks. pos has x, y, and z chunk coordinates of the chunk you just entered

game.on('renderChunk', function(chunk) {})

emits when a chunk is drawn (using the showChunk method). chunk is the full chunk object, which has the voxel data and a .position and .dims

game.on('missingChunk', function(chunkPosition) {})

emits when the player moves into range of a chunk that isn't loaded yet. if your game has generateChunks set to true it will automatically create the chunk and render it but if you are providing your own chunk generation then you can use this to hook into the game.

game.on('dirtyChunkUpdate', function(chunk) {})

emits when game updates a chunk, this is usually triggered when a chunk gets edited. if game.setBlock were to get called 50 times on one chunk in between renders, dirtyChunkUpdate will emit once with the chunk that gets updated

game.on('setBlock', function(pos, val, old) {})

emits whenever game.setBlock gets called

Collisions

Check for collisions between an item and other 'things'

Detects collisions between an item and other items, or voxels.

game.getCollisions(item.mesh.position, item)

This will give you back a 'collisions object' whose keys are positions on the object and values are arrays of the positions of faces that are colliding.

For example, here we have 4 faces colliding with the bottom of our object:

{
  back: Array[0]
  bottom: Array[4]
  down: Array[1]
  forward: Array[0]
  left: Array[0]
  middle: Array[0]
  right: Array[0]
  top: Array[0]
  up: Array[0]
}

Textures

Loading textures onto the texture atlas.

game.materials.load(['obsidian', 'dirt'], function(textures) { })

Both of these textures will be loaded into the texture atlas and expanded creating 2 voxel block types.

Texture-less worlds with flat colors

You can specify hex colors to use as materials, just pass these options when creating a game:

{
  materials: ["#fff", "#000", "#ff0000"],
  materialFlatColor: true
}

Items

  • Items are non-voxel objects you can add to your game. e.g. Monsters/Players, Powerups, etc.
  • Items currently implement their own physics, which is calculated every 'tick' by running an items' item.tick function. It's not very sophisticated.
  • Items .mesh property is the thing that's actually processed by the THREE.js engine. Other properties of item are used in voxel.js to update the mesh, e.g. item.velocity.y is used every tick to calculate the next position the mesh should be in.
  • Using the current item physics system, setting item.resting to false will force an item to recalculate it's position.

Example: Creating an Item

// create a mesh and use the internal game material (texture atlas)
var mesh = new game.THREE.Mesh(
  new game.THREE.CubeGeometry(1, 3, 1), // width, height, depth
  game.materials.material
)

// paint the mesh with a specific texture in the atlas
game.materials.paint(mesh, 'obsidian')

// move the item to some location
mesh.position.set(0, 3, -5)

var item = game.addItem({
  mesh: mesh,
  size: 1,
  velocity: { x: 0, y: 0, z: 0 } // initial velocity
})
// use `game.removeItem(item)` to remove

voxel interchange format

{
  "voxels": [packed 1D array of voxels],
  "dimensions": [2, 2, 2],
  "position": [10, 10, 10]
}

this should be generated by something like this:

  var length = 5, width = 5, depth = 5
  var start = [10, 10, 10]
  var voxels = new Int8Array(length * width * depth)
  var idx = 0
  for(var z = start[2]; z < depth; ++z)
  for(var y = start[1]; y < height; ++y)
  for(var x = start[0]; x < length; ++x, ++idx) {
    voxels[idx] = getVoxelDataFor(x+start[0], y+start[1], z+start[2])
  }
  return {voxels: voxels, dimensions: [length, width, height], position: start}

Timing

setTimeout and setInterval work fine when timing things against the computer's clock but what about staying in sync with the game's clock? When the game lags, is paused or hasn't begun you probably don't want your timed operations firing.

game.setInterval(fn, duration[, args]) and game.setTimeout(fn, duration[, args]) are available and similar to the built in interval functions but stay in sync with the game's clock.

An example is we want our object to jump every 2 seconds. Normally we'd just do:

setInterval(function() {
  jump()
}, 2000)

But if the game's frame rate drops or the game hasn't begun the computer will still fire the jump() function every 2 seconds. Thus causing the object to fly way up into the air.

var clearInterval = game.setInterval(function() {
  jump()
}, 2000)
// later we can stop the interval by calling clearInterval()

Will achieve the same thing although now when the game's frame rate drops the jump() function won't be called repeatedly and the object will jump at the desired frequency.

style guide

basically https://github.com/felixge/node-style-guide#nodejs-style-guide with a couple of minor changes:

  • no semicolons
  • single line ifs/fors when appropriate for terseness
  • no hard to understand for n00bs 'tricks' unless they are faster

any contributions (pull requests) in any style are welcome, as long as:

  • they are written in javascript
  • they merge cleanly

if you send a pull request and you use, for example, 4 space indents it will not be rejected but please try to follow conventions when you can

license

BSD (see LICENSE)

voxel-engine's People

Contributors

bmeck avatar chrisdickinson avatar dariusk avatar deathcap avatar dilibau avatar goutte avatar hughsk avatar konklone avatar kumavis avatar max-mapper avatar mrdnk avatar nakedible avatar rachel-carvalho avatar shama avatar theoxylo avatar timoxley avatar vogonistic avatar wraithan avatar yenthefirst avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

voxel-engine's Issues

Support for Dvorak Keyboard Layout

After searching, I already found that AZERTY layout support was added via #23.

Now I'm wondering if I just want hard-coded support for Dvorak as well, or if keybindings makes sense as either a configurable option, or a separate module altogether. I'd like to make these changes myself and submit it as a PR, but not before asking what the preferred direction should be.

Cheers

Harder to jump onto a box?

I don't know if it's just me, but suddenly it feels harder to jump up onto a block.
Haven't had the chance to investigate properly, will check out tomorrow, if I get a chance.

Has anyone else noticed this? Or is it my own illusion?

Forcing master branch to render blocks

I opened this ticket because my other ticket #120 seems to be unsolvable, due to shader problems im not experienced with.

My problem is that my project has to have transparent blocks, or partially transparent, my question is, where does the master branch determines if a block should be rendered or not? I'm guessing it has to be somewhere at raycasting but im not feeling sure..

Why use x,y,z parameters instead of Vector3

The world generator takes x,y,z parameters instead of a Vector3 object. Since a vector can define a point, it makes sense just to use vectors everywhere, at least to me. This will make the API more consistent.

non-cube voxels?

Any chance to display and collision-mesh voxels with one longer axis?
I have here a sampled object (by slices), but the distance between the slices is about 1.5 "length of pixel".
To have this voxel space displayed at the right ratio I would have to stretch the cubes of all voxels.

Is this possible with the engine at this time? if not: is it hard to change?

frustum culling chunks?

when looking at the draw call previews in the WebGL inspector in newer Chrome i'm seeing a lot of draw calls for things that aren't in the view frustum.

apparently three.js has built in frustum culling but I imagine we could do it better if we did it manually?

Worldless issue

Whenever I try to create a flat world with code I copied off of the voxel.js engine page but nothing shows up. Whenever I tried to use the voxel-perlin-terrain generator i see flashes of the generated world. I also tried to create a sphere with the given code and still nothing. I thought maybe i needed to move the player up with the "player.yaw.postion(x,y,z)" function. The console then gave me an error saying "Object is not a function". I am an amateur programmer so if this is something simple I don't see it.

Large positions cause strange behavior, glitchly camera, falling through blocks, no rendering.

Take the code below, it will function fine. However, if you were to change "largenumber" to -12345678 then dude falls through the world, or if you move while falling, and happen to not fall through the world, camera movement/movement in general is strange. if you change "largenumber" to -123456789 the world does not render at all.

var largenumber = -1234567
var createGame = require('voxel-engine')
var game = createGame({
textures : './textures/',
materials: [['grass', 'dirt', 'grass_dirt'], 'brick', 'dirt'],
materialFlatColor: false,
generate: function(x, y, z) {
return y === 1 ? 1 : 0
},
worldOrigin: [largenumber, 0, 0],
container : document.querySelector('#container')
})
game.appendTo(container)
game.createBlock([largenumber, 10, 0], 2)
var createplayer = require('voxel-player')(game)
var dude = createplayer()
dude.possess()
dude.yaw.position.set(largenumber, 100, 0)

How to create block types that don't fill the whole voxel cube?

I'd like to have block types whose geometry only takes up part of a voxel - like the glass panes, slabs, and stairs in Minecraft.

  1. Is that currently possible? Do I need a special module? If so, which one?

That's my main question, but here are some bonus questions if you're feeling generous:

  1. If the answer to 1 is "yes": will my in-game avatar collide with the visible edges of the block, or with the edge of the voxel? For example, if I create a wall of glass panes, will I be able to move partway into that voxel (until I hit the actual glass), or will I hit an invisible wall (the edge of the voxel) just in front of the glass?
  2. If the answer to 2 is "you won't collide with the edge of the voxel": will the player movement routines handle these blocks in a sensible way? For example, if I create a ramp or stair block type, and I run straight into one, will I climb it?

Basically, I'd like to create a game world that allows you to move from lower locations to higher ones without having to jump constantly.

water voxels

shouldn't be tooooo hard if we implement water as a new kind of chunk that draws on it's own

Keybindings

How would I make a keybinding for if the right mouse button is pressed the following happens.

position = block;
    console.log("Position: " + position);
    var blockType = game.getBlock(position);
    console.log("Checked: " + blockType);

I can get it working with the left button only.

game.on('fire', function (pos){
    position = block;
    console.log("Position: " + position);
    var blockType = game.getBlock(position);
    console.log("Checked: " + blockType);
})

"TypeError: Cannot read property 'position' of undefined" with setBlock() if the position is greater than chunkSize

Cannot use game.setBlock(...) to create blocks outside of visible chunk range.
Game config:

 {
    chunkDistance: 1,
    chunkSize: 16,
     ...
}

To reproduce:

// tower with different textures
var tower = [
        1, 2, 1, 3, 1, 2, 3, 1, 2, 1, 2, 3, 1, 2, 3, 2, 1, 2, 3, 2, 1, 2, 2, 2, 2, 1, 1, 1, 1, 1,
        1, 2, 1, 3, 1, 2, 3, 1, 2, 1, 2, 3, 1, 2, 3, 2, 1, 2, 3, 2, 1, 2, 2, 2, 2, 1, 1, 1, 1, 1,
        1, 2, 1, 3, 1, 2, 3, 1, 2, 1, 2, 3, 1, 2, 3, 2, 1, 2, 3, 2, 1, 2, 2, 2, 2, 1, 1, 1, 1, 1,
        1, 2, 1, 3, 1, 2, 3, 1, 2, 1, 2, 3, 1, 2, 3, 2, 1, 2, 3, 2, 1, 2, 2, 2, 2, 1, 1, 1, 1, 1
      ]
tower.forEach(function (item, i) {
  var pos = [1,i,2]
  console.log(pos)
  game.setBlock(pos, item)
})

The last log prints [1, 16, 2], then error:

TypeError: Cannot read property 'position' of undefined

This can also be reproduced via the console after the game has been fully initialized.
See https://github.com/vladikoff/voxel-test-playground for an example of this issue.

Double declaration

It would seem that you've declared var substack twice in the hello world example, I'd imagine this could be quite confusing to 'some' people looking to figure out how voxel-engine work.

lines: 40 & 49 of index.js in the gh-pages branch.

chris

getCollisions undefined

the documentation provides information about a function named getCollisions, which is undefined - am i completely failing or is the documentation outdated? is there currently an alternative?

thank you for initiating this project - coderect

Chunk property naming (.dims abbreviation)

.dims is abbreviated, yet .position and .voxels is not. Should probably abbreviate them all or spell them all out.

dims: Array[3]
position: Array[3]
voxels: Int8Array[64]

Storing the world

Hello,
i have a quick and simple question. Sorry if that's a duplicate but i was not able to find anything helpfull on the internet. So, the thing is: is there any way to store the world as array or JSON ?

All the examples i had browsed have some kind of world-generating algorithm.

Thanks in advance for your help. Keep up the great work! :)

Can't run in a worker

This is b/c it sees that its in a browser, but doesn't have webgl support.

Solution: don't check for webgl support if isClient is false

World won't render on localhost, but renders on voxel creator

Sorry to post this here, but the three questions on stackoverflow about voxel.js have 0 responses, so I'm hoping I can get help here. I'm doing a really basic setup, with the texture folder there, and I can't get the world to show up. The blue screen of the game is there, but no voxels are rendered. No JS errors and the console just has THREE.WebGLRenderer 56, which from the code, is just the revision number for three.js. bundle.js seems to be bundling correctly (I tested by calling a function that didn't exist, then refreshing, which correctly threw errors). When I paste the code in voxel creator, it works just fine. But of course, I'd love to use it on my own system. WebGL seems to be working fine. Running it on mountain lion. Here is the code:

var createGame = require('voxel-engine');
var game = createGame({
    texturePath: 'textures/'
});

var container = document.body;
game.appendTo(container);

// create a player
var createPlayer = require('voxel-player')(game);
var player = createPlayer('textures/shama.png');
player.yaw.position.set(0, 100, 0);
player.possess();

Super basic. Here is my package.json. Is there some dependency I'm missing?

{
  "name": "voxel-test",
  "version": "0.0.0",
  "description": "ERROR: No README.md file found!",
  "main": "index.js",
  "scripts": {
    "start": "echo \"open localhost:8080/\" && ./node_modules/.bin/browservefy index.js 8080 -- -d"
  },
  "repository": "",
  "author": "",
  "license": "BSD",
  "devDependencies": {
    "voxel-engine": "~0.18.2",
    "voxel-player": "~0.1.0",
    "browservefy": "0.0.10",
    "voxel-texture": "~0.5.6",
    "three": "~0.58.9"
  }
}

Should I use an older version of the engine? I know that this isn't the usual way to submit questions, but I don't really know how else to reach out to someone about it. But I must say, I love this project, and I can't wait to get cranking on it. You guys are doing some awesome work!

License

Should the whole Voxel-* project just use GLPv3?

path.relative is not a function

Following the instructions at http://voxeljs.com/#how (modifying only the script name - mygamename became howgame1), after running browserify, including builtgame.js in an HTML document and loading it in a browser (Chrome 21 & 24, FF19 Beta on Win7-64, Ubuntu 12.04) nothing is displayed except the following stack trace in Chrome's devtools console:

Uncaught TypeError: Object #<Object> has no method 'relative' builtgame.js:44380
module.exports builtgame.js:44380
(anonymous function) builtgame.js:44386
require.modules.(anonymous function) builtgame.js:182
require builtgame.js:8
(anonymous function) builtgame.js:44395
(anonymous function) builtgame.js:44396

(Edit: originally posted incorrect line #'s that included some debugging lines)

Dumping the path object shows the following methods: basename, dirname, extname, join, normalize & resolve.

Firefox simply says path.relative is not a function

I tried updating the package.json to use voxel-engine 0.5.1 and running npm install again, but to no effect.

Edit: build environment: Ubuntu 12.04, node 0.8.14, npm 1.1.6

3rd Person Camera

I'm opening this up as an issue, but in reality it's something I'm going to start working on.

Not sure that its the right place (as in the spirit of the project it would be a module) but I figured it would be a good place to store discussion and opinions if other people are interested or working on something similar.

(feel free to delete this issue or tell me to bugger off if appropriate)

Handling a globe

I would like to model large3d bodies seamlessly. The world coordinates seem to be able to go infintely in all directions. I'd like to be able to define a boundary where the world "wraps around".

Is there a relatively easy way to do this?

setting blocks that collide with items

Currently, items are quite happy to be swallowed by blocks placed over them:

e.g.

Screen Shot 2013-02-02 at 6 16 14 PM

game.setBlock(item.mesh.position, 1)

Screen Shot 2013-02-02 at 6 16 25 PM
Here's some options:

  1. move item out of the way, requires figuring out which direction item should go such that it will no longer collide (could be any distance)
  2. delete item
  3. disallow blocks being set where they would collide with items
  4. combination of 1 and 2, where item tries to move out of the way, but if it has to move more than x number of blocks, it is instead deleted.
  5. do nothing.

In minecraft, collided objects will be destroyed/turned to debris, or you're simply prevented from placing the blocks entirely, depending on the type of item. Perhaps selecting between these behaviours should be an item flag.

Blank stream module?

I haven't looked too deeply into the code yet, but I noticed there are several places trying to access a stream.Stream object from require('stream'), but the module seems to just be blank...

require.define("stream", function (require, module, exports, __dirname, __filename) {
    // todo
});

This may also be something up with browserify. I'm assuming this is supposed to be the built-in stream module in node?

It entirely possible I just did something stupid when trying to run it...

Sprites interacting with voxels

As a bit of background, or context.
What I'm hoping to achieve is a world/level where the physics is handled by voxel-engine but the visuals are actually just 2d painted sprites layered over transparent voxels/meashes.

The issue im comming up against seems similar to the issue mentioned in: Issue #34 but in my case the voxels behind the transparent voxel Are visible as well as the player meshes when walking behind the transparent voxel, BUT sprites rendered at the same position as the transparent voxel are being covered by the voxel.

example: http://christopherdebeer.com/sandbox/voxeljs/

Any ideas?

@shama or @vogonistic, @mbalho mentioned that you might have some insights, if you do, it would be much appreciated.

Chunks disapear

I wrote some code for a free camera movement without a player. The voxel-engine code states that if there is no player voxel.js will take the position of the camera to find chunks that are far away and remove them.
So far everything is working fine BUT the chunks won't load when the camera gets close to them again. I tried to force voxel.js to show them but that won't work too.
cp = game.camera.position.toArray();
var chunkX = Math.floor(cp[0]/32);
var chunkY = Math.floor(cp[1]/32);
var chunkZ = Math.floor(cp[2]/32);

console.debug("Update Map around: " + [chunkX, chunkY, chunkZ].toString());

game.showChunk(game.getChunkAtPosition([chunkX, chunkY, chunkZ]));
game.showChunk(game.getChunkAtPosition([chunkX + 1, chunkY, chunkZ]));
game.showChunk(game.getChunkAtPosition([chunkX + 1, chunkY , chunkZ - 1]));
game.showChunk(game.getChunkAtPosition([chunkX, chunkY, chunkZ -1]));
game.showChunk(game.getChunkAtPosition([chunkX + 1, chunkY, chunkZ + 1]));
game.showChunk(game.getChunkAtPosition([chunkX -1, chunkY, chunkZ - 1]));
game.showChunk(game.getChunkAtPosition([chunkX -1, chunkY, chunkZ]));
game.showChunk(game.getChunkAtPosition([chunkX -1, chunkY, chunkZ + 1]));
game.showChunk(game.getChunkAtPosition([chunkX, chunkY, chunkZ + 1]));

I used game.setBlock([msg["x"],1 ,msg["y"]], c) to create the blocks. Is this the right way or will it just display the blocks until the chunk is hidden the first time?

Jumping is inconsistent. Colliding with blocks.

Jumping is typically inconsistent. One manages to jump once out of ever five or so attempts.

When the
controlOptions: {
jump: 15
}

Is set to something high enough, you can jump against something above you. It will press you against block and hold you there. If you strafe out from under the block above your head. You may still have +Y velocity and go up.

Async loading of chunks

I have a package that handle operations (getting blocks, setting blocks, loading from files, saving from files) on a minecraft world.
It is designed to be async to handle easily IO backends.
It's currently only used on a minecraft server but it works fairly well so I'm investigating ways to visualize World instance with voxeljs.
The most used interface to get blocks in voxel seems to be the generate(x,y,z) function but that is completely sync hence I can't use it.
I found in a few modules the use of generateVoxelChunk and emitting "missingChunk" event to handle async chunk loading, but that seems a bit hacky and it's a bit hard to make it work, because I can't find any documentation on generateVoxelChunk.

Does anyone have a clue what would be the best way to render the chunk asyncly ?

prismarine-world provide a getColumn async function, and it should be called when voxeljs decide it's time to render such and such chunks.

I'll keep testing things but I'd appreciate any info about this !

Demo fails to load on chrome

chrome 26.0.1384.2 dev, on ubuntu 11.10

fails to load. console shows error:
Uncaught TypeError: Cannot read property 'Texture' of undefined browserify-bundle.js:40705

function in question:

Skin.prototype.getMaterial = function(img, transparent) {
var texture = new THREE.Texture(img);
Uncaught TypeError: Cannot read property 'Texture' of undefined
texture.magFilter = THREE.NearestFilter;
texture.minFilter = THREE.NearestFilter;
texture.format = transparent ? THREE.RGBAFormat : THREE.RGBFormat;
texture.needsUpdate = true;
var material = new THREE.MeshBasicMaterial({
map : texture,
transparent : transparent ? true : false
});
return material;
}

Game.prototype.raycastVoxels sometimes returns adjacent block that is not adjacent

Rounding causes the adjacent block to be skipped. I am not sure what do do about it beside manually checking the resulting block positions (Math.floor) for each of 6 directions.

1.9999999999999998 + 1 === 3 // true

Failed test:

gameTest(function raycastVoxels(game, t) {
  var pos = [1, 1, 1]
  game.setBlock(pos, 1)
  var start = [1.994133710861206, 3.1129817962646484, 3.9677624702453613]
  var direction = [-0.16332358934799918, -0.4095857816495397, -0.8975326693959512]
  var hit = game.raycast(start, direction, 10)
  console.log(hit)
  t.equal(hit.adjacent[1], 2)
})

Test output:

TAP version 13                                                                                                  
# raycastVoxels                                                                                                 
{ position: [ 1.5503287987061696, 1.9999999999999998, 1.5288654983645178 ],                                     
  direction:                                                                                                    
   [ -0.16332358934799918,                                                                                      
     -0.4095857816495397,                                                                                       
     -0.8975326693959512 ],                                                                                     
  value: 1,                                                                                                     
  normal: [ 0, 1, 0 ],                                                                                          
  adjacent: [ 1.5503287987061696, 3, 1.5288654983645178 ] }                                                     
not ok 1 should be equal                                                                                        
  ---                                                                                                           
    operator: equal                                                                                             
    expected: 2                                                                                                 
    actual:   3                                                                                                 
    at: raycastVoxels (/var/lib/stickshift/5121adb5e0b8cde61e00007f/app-root/data/409279/node_modules/voxel-engi
ne/test_raycast_skip.js:23:5)                                                                                   
  ...                                                                                                           

1..1                                                                                                            
# tests 1                                                                                                       
# pass  0                                                                                                       
# fail  1      

Allow camera overide in opts

I've been trying to get the voxel-engine to accept a custom camera (ie: OrthographicCamera )
and it would seem that the Game prototype needs something like this:

this.camera = this.createCamera( opts.camera || false )

and createCamera needs changing like so:

Game.prototype.createCamera = function( customCamera ) {
  camera = customCamera || new THREE.PerspectiveCamera(60, this.width / this.height, 1, 10000)
  camera.lookAt(new THREE.Vector3(0, 0, 0))
  this.scene.add(camera)
  return camera
}

Does this seem like a good idea, or am I being stupid? If not then pull request to follow.

Undeletable block in demo

Anyone else noticed the undeletable block in the demo?
Its the second block down, underneath the Viking his right or your left side (if you're looking at him face on).

Haven't discovered the cause.

better mobile support

for mobile controls there have been a few experimental modules written:

https://github.com/DamonOehlman/voxel-touch-hello-world
https://github.com/DamonOehlman/voxel-touchy
https://github.com/maxogden/fps-touch-controls
voxel-touchcontrols on npm

the main focus has been making voxel-engine fast, but not much work has been done to find out settings configurations that work well on mobile.

in voxel-engine you can pass some options that help with rendering:

chunkDistance: this controls how much of a radius around the player to draw at a given time, e.g. setting it at 1 draws 1 chunk in each direction. the lower this is the faster the game will run but the less of the world you'll be able to see

materialFlatColor: if set to true the game will use flat colored materials instead of textured materials which should render faster

Documentation - VoxelJS

@shama @deathcap

I went a head and created a wiki where we can start working and putting up more collective documentation. Its only a start and we can totally disregard it if you wish. Also, the domain name should probably be changed to something like voxeljs.io etc. or something but it costs to get a better domain name, also we should discuss what it should actually be called, 'voxelwiki' doesnt sound too nice. Once you have made accounts on the wiki I will bump you up to admins so you have unrestricted powers ๐Ÿ˜„

2d mode

would it be a smart thing to code a 2d mode plugin for voxel and use that to create a 2d game while still using the awesome voxel ecosystem?

Or is that a huge waste of cpu and browser compatibility and causes unnecessary complexity?

Game.getBlock: Assignment to parameter in arguments object

The profiler in Chrome 34.0.1847.131 reports this function:

Game.prototype.getBlock = function(pos) {
  pos = this.parseVectorArguments(arguments)
  return this.voxels.voxelAtPosition(pos)
}

is not optimizable because: "Assignment to parameter in arguments object"

screen shot 2014-05-06 at 9 28 42 pm

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.