Which direction to take for developing 3D interactive imagery features - javascript

I will keep this simple. I am looking everywhere to find something to create 3d tour of an interior similar to photosynth and gmaps street view but only with javascript.
Seadragon is the closest thing I found but its not 3d. Sorry if this is too simple but please let me know if you know any API that this can be achieved with.
Thanks a bunch
[I need this to be working with current usual web technologies so HTML5 solutions won't help]
Here are some stuff I found but not exactly my ideal:
jQuery simple panorama viewer but this is not exactly sleek/intuitive but does have a appeal as in terms of scalability, it will not require members to spend so much time taking 100s of photos to create a 3d model of a space.
of course Microsoft zoom it or seadragon which is really sleek and also doesn't need excellent photography skills but doesn't produce 3d models
Photosynth and Unity are great but even though I am thankful to Itay Moav with his/her post below I really want and need to move away from expecting people to have a plugin on their system in order to access a service as this has a huge user experience down turn.

You want to look for a 3d space-filling-curve. A 3d sfc reduces the 3d complexity to a 1d complexity. It's a bit like an octree and a fractal. For 2d you want to look for a 2d space-filling-curve. You want to look for Nick's spatial index quadtree hilbert curve blog: http://blog.notdot.net/2009/11/Damn-Cool-Algorithms-Spatial-indexing-with-Quadtrees-and-Hilbert-Curves.

I would use Unity, if you do not care about Linux users (Apple users are good).
It even has a Javascript API

Related

How to render point cloud data in browser with iTowns2

I am attempting to use iTowns2 (https://github.com/iTowns/itowns2) to visualize point cloud data in the browser. According to the README: "[iTowns'] first purpose was the visualisation of street view images and terrestrial lidar point cloud."
From this I glean that there should be instances of people using iTowns to visualize point cloud data somewhere online. I've been looking for days and I can't find an example of someone using iTowns2 to visualize point cloud data in the browser.
The example in the GH repo renders a globe in the browser but no point cloud. There is a iTowns/iTowns2-sample-data repo which has a bunch of point cloud data but no instructions on how to use the data or references to other resources.
Has anyone used this package to show point cloud data in the browser? Does anyone know an article or resource that demonstrates doing this with iTowns2? Does anyone know of a different library for rendering point cloud data with examples and/or better documentation?
Ideally I would be able to track down the source code for something like this: http://www.itowns-project.org/#demo
The documentation is quite ambiguous, and judgind by the Github issues it looks like the library is under heavy refactoring.
I took a quick look to this repo and realized that it is just using Potree for point cloud visualization:
http://potree.org/
So you can just use Potree directly. Wich is better documented.
In addition to this, it's quite trivial to set up your own point cloud visualizer using Three.js.
Just take a look at the Points object:
https://threejs.org/docs/#api/objects/Points
And this example:
https://github.com/mrdoob/three.js/blob/master/examples/webgl_buffergeometry_points.html
Three.js also includes some 3D format loaders, like ply:
https://github.com/mrdoob/three.js/blob/master/examples/webgl_loader_ply.html
If you are interested in using las files you might also want to look at:
https://github.com/verma/plasio
Let's provide a early 2018 update! (source: I'm a maintainer)
iTowns now supports visualizing pointclouds directly. You can test it here: http://www.itowns-project.org/itowns/examples/pointcloud.html
If you want to test your own data, please visit http://www.itowns-project.org/itowns/examples/pointcloud.html?selector=1
We currently support results from PotreeConverter, and lopocs. We plan to add 3dtiles pointcloud format soon.
We indeed used potree for pointclouds before, but that was not ideal, a bit because we diverge on some technology/design choices, but mainly because using potree prevented us to tightly integrate pointcloud visualization in iTowns. For instance, iTowns stops its rendering loop when it has nothing to do (saves a lot of cpu), and potree does not. It also allows us to implement our own culling/SSE/network priority... heuristics.
Potree has currently better graphic post-treatments of pointclouds, although we also plan to add EDL and other improvements (occlusions for instance) soon. And of course, the advantage of iTowns is that it's not limited to pointclouds, but can display a variety of data type, from rasters to vectors, see the examples page and especially this example of a pointcloud on a globe.
But the main difference between these 2 projects is that Potree aims at being a standalone viewer (AFAIK), whereas iTowns is more a framework to implement your own app! Potree remains a big source of inspiration for us concerning pointclouds, big kudos to their maintainer :-)
(Btw, the github has moved to https://github.com/iTowns/itowns)

canvas/webgl based 3d community platform (open source)

I've been looking at three.js for a while and I was wondering if there are any open-source platforms that currently exist which provide a 3d community experience. There were many of these back in the days of VRML and X3D, just wondering if anyone has developed anything of this sort yet.
In other words:
3d multi-user worlds
realtime chat
objects/items
accounts
1st person + avatars
As far as I know, It doesn't exist yet. Altough I've seen several games/platforms in development. The closest one I know, that has most of your implmentations is Cloud Party which is built webgl, not on Three.js.

3D development - Javascript/HTML5/CSS3?

I am working on this new project, wich is a new technology for me...
I'm working with Appcelerator Titanium, building this 3d application...
My applications suppose to be something like 3d Canvas...
I mean a ability to add objects to canvas (drag&drop),rotate them (3d),
and most important to rotate the whole Canvas(3d).
From checking the subject came with a lot of Plug-Ins and libraries:
Three.js,WebGl,HTML5 Canvas,CSS3...
The question is-Is anybody have an idea what is the best to use for
this mission?
Thanks!
Three.js makes it super-easy to make primitives and load pre-generated objects (typically from JSON data).
https://github.com/mrdoob/three.js/
Check out the examples at the bottom of the page, and note how little code is necessary to do anything. The only disadvantage is the overhead of a huge library like Three.js, along with the fact that it is still in its infancy and changing slightly by the month. Beyond that, there's not much advice I can give you as I have no idea what kinds of objects you plan to put in this canvas or what the goal if the project is.

What are good JS libraries for game dev? (HTML5)

If i decide to write a simple game both text and graphical (2d) what libs may i use? Assuming we are using a HTML5 compatible browser.
The main things i can think of
Rendering text on screen
Animating sprites (using images/css)
Input (capturing the arrow keys and getting relative mouse positions)
Perhaps some preloading resource or dynamically loading resources and choosing order
Sound (but i am unsure how important this will be to me at first). Perhaps with mixing and chaining sounds or looping forever until stop.
Networking (low priority) to connect a user to another or to continuously GET data without multiple request (i know this exist but i dont know how easy it is to setup or use. But this isnt important to me. Its for the question).
Well.... there's Rocket Engine. I haven't used it, but it appears (on the surface) to do much of what you want.
I'd also recommend HTML5 Gamer, a blog on the issues for building games in HTML5/JS
GameJs does this:
Sprites, SpriteGroups
Text rendering
input handling (key/mouse)
collision detection
sound
resource preloading
http://gamejs.org, Disclaimer: I'm dev of GameJs.
The stuff above works good and I did games with it. The API is similar to http://PyGame.org which some people like a lot.
Networking is planned.
If you're familiar with jQuery then gamequery is a good one to try. Here's a great demo of what you can do with it: brainsnackers.
Here are some of the features:
multi layer-sprite animations sprite
hierarchies (grouping) collision
detection swappable sound support
periodic callbacks keyboard state
polling free and open source license
Check out cake js. It's been around a long time and it's really nice to use - especially if you've used actionscript before.
The http://js1k.com contest just ended and the 2D platform game Legend Of The Bouncing Beholder (by marijnjh) was the winning entry. You might want to look over the source since it would provide a very easy to grasp overview of sidescrollers without needing to read lots of code.
Another good one is the two-player crazy pong which is a lot of fun.
Plus, 1kb games are just awesome.
i would use RenderEngine i think it has all you need and solves one of the most important problems that would be collision detection, and it also has sprite support...
Tutorial <- this is a great tutorial i found
i hope this helps
I can recommend Cometd for using ajax push networking (ie. comet)
What about createJS (createjs.com) or melonJS (melonjs.github.io/tutorial)?
CreateJS has great support for those items you mentioned, not so sure about networking though.
MelonJS has native support for reading Tiled tilemap .tmx files.

Programming coordinates-based game, like dots or checkers

I'm looking to learn some fundamentals on cartesian geometry or coordinates based game programming. Platform is irrelevant, although I'm most proficient in JavaScript, C, Objective-C. Ultimately being able to create something such as dots or checkers would be ideal. The idea is for me to learn how sprites work and how pathing works programmatically. My question to you folks is where is the best place to learn the fundamentals? Something that isn't math heavy because to be quite frank, anything further advanced than calculus to me at this point is a grey line and requires refreshing my memory.
If there is a particular book, site, or open source project -- that would probably help me the most.
Thanks for any ideas.
I think there's a few more steps to accomplishing your objective, which is understanding the basics of game programming. You mentioned understanding sprites and pathing, which are imperative to game programming, but I think that initially you should spend a little time understanding the programming and methodology behind general graphical user interaction.
Regardless of what language you will eventually program your game in, I think that learning in a modern language like Java or C# will provide you with a vast amount of libraries and will allow you to accomplish tasks like animation and Event Listeners much more simply.
Here is a list of guides and tutorials that I think will be extremely helpful to you just as they were to me and others:
This is an extremely-detailed tutorial for a Java Game Framework that includes full source code and a full walk through (with source code) of writing the infamous "Snake" game in Java, complete with a control panel, score board, and sound effects!
The book "Beginning Java 5 Game Programming" by Jonathan S. Harbour will introduce you to concepts such as 2D vector graphics and bitmap including sprite animation. Plus you can get it used on Amazon Marketplace for $12!
Here is an unbelievable tutorial on Sprite Animation that has more than 5 parts to it! Plus it's written by Richard Baldwin, a Professor of CompSci and an extremely reliable and knowledgeable source. For more tutorials by him, this is his site.
Between these sources you're going to possess the methodology of the parts that go into a game, which are applicable in any language, as well as the knowledge of how those parts can be actually implemented as well.
G'luck!
O'Reilly has a great tutorial on simple game development using Objective-C and Cocoa on the Mac. Lines of Action.
othello and the book is of course the renowned PAIP by Peter Norvig
A site I frequently visit is GameDev.net. They have a lot of resources for game programming in general. The forums are a great place to get more specific answers on game development.
On the site, visit the Articles and References page, which contains articles written by developers on various game topics.
You don't learn about a car engine by reading the Chilton's manual; you have to pop the hood and get your hands dirty!
Hope this helps.
I'm currently working on a checkers program using pygame. It's simple beyond imagination to get the graphics working, and the math that you need to achieve fluid movement is just simple vectors and vector animation.
Each rectangle or square on the board has a centerx and centery coordinate. The next square diagonal on the left is centerx - 82 and centery + 82 or the next diagonal on the right is centerx + 82 and centery + 82. A jump is just 2 diagonals. Make the functions separate to modularize your code and without much math you've got a simple checkers program. Easy.
Well, for Java, there's an API called GridWorld, (Its used as a case study for the AP Computer Science exam, which is why I'm familiar with it) It uses a coordinate system, so you might learn something from looking at it.
You will probably want to understand minimax and Alpha Beta pruning.
Sprite animation is going differ significantly based on what platform you choose to do your program on, and any generic reference for animating on that platform will get you through that. If you want to shoot for Java, Yoely's references look pretty good.
For the game AI, though, I recommend you check out Artificial Intelligence: A Modern Approach by Russell and Norvig. It looks intimidating, and understanding much of the book will take a working knowledge of high-level math concepts. However, it is engaging and well-written, and you can probably make it through the first dozen chapters or so without hitting any math landmines. The algorithms and concepts in that book will be more than enough to help you program AI for a simple game, and might even help you decide on one.
My suggestion would be to use a language/development environment that makes working with sprites easy.
Take a look at Scratch.
The Scratch web site contains thousands of projects that you can download and edit right in the development environment.
Here are some projects to get you started: http://scratch.mit.edu/tags/view/checkers
Plus, there is a good online forum filled with helpful people if you get stuck!
Once you make a game using Scratch, you can upload/share it right from the development environment or you can post it on your own web site (although that takes some doing).
Hope this helps.
http://www.gamedev.net/
This is probably one of the most well known game/graphics programming site on the net. Its forums are subject to computational geometry, algorithms and all levels of GPU programming concepts.
You would be able to get a lot of help here. There are many articles on the subject of game programming already on this site from which you can see examples and understand the thought processes behind putting together these kinds of systems.
:]
http://www.pygame.org/
Python is great to get started, and nice examples and tutorials available.

Categories