Hi,
I’ve taken a look around the api docs for Cocos2d-JS 3.6; and have also taken a look at some of the samples and the hello world template. However - it doesn’t seem like there’s any way to load a c3b or c3t file to view in a website using cocos2d-js.
Is this correct or am I missing something; using cocos2d-x with C++ on iOS it was simply:
auto spr = Sprite3D::create("name_of_file.c3b");
I would like to display a c3b file on the web though; as well as in iOS using C++??
Thanks,
Reece.
Hello Reece,
at this moment 3D features are native exclusive (iOS, Mac, Win, Android).
While these 3D modules are bound to JSB, they can only run in a native environment (using OpenGL):
jsb.Animate3D
jsb.Animation3D
jsb.Sprite3D
jsb.Skeleton3D
jsb.Mesh
jsb.AttachNode
jsb.BillBoard
jsb.sprite3DCache
jsb.ParticleSystem3D
jsb.PUParticleSystem3D
jsb.BaseLight
jsb.DirectionLight
jsb.PointLight
jsb.SpotLight
jsb.AmbientLight
So, you’ll have to do the cc.sys.isNative (returns false in browsers) check and then implement your Sprite3D. Alone for performance reasons, i would recommend C++ for native 3D games instead of JavaScript.
I See - thanks for your reply. I guess I was hoping for something similar to PowerVR e.g. how with their pipeline you can pass pvr models and load them in a WebGL context.
Anyhow - do you have any advice on how I could parse a c3b/c3t file for my own purposes; e.g. to load into a WebGL context if I were to take a custom approach? My Goal is that my users can visualize models in the web before viewing them on native mobile; the latter of course is easy to do with Cocos2dx.
C3B and C3T are Cocos2D-X formats as you know. I don’t know if someone has written an implementation for WebGL yet. If it needs to be 3D on the web, i suggest you go with canvas or WebGL:
Example by BKcore(HexGL):
http://hexgl.bkcore.com/play/
Three.js:
http://threejs.org/
And there are many more out there that are perfect for your case.
yeh thanks… Have used three.js a little before - its pretty neat; I’m using fbx as an intermediary file type (as its required by fbx-conv) so could probably use something like this: https://github.com/mrdoob/three.js/tree/master/utils/converters/fbx
To load the same model in three.js; I’m anticipating however there to be visible differences between web and cocos2d-x c++ loader…
Looking at the json file format of c3t, it shouldn’t be too hard (a couple of days?) to write a webGL loader. Not looking to re-invent the wheel here though if I don’t have to. Will post back if I have anything useful to report. Thanks.
@grire974 You’re welcome. All you need is a switch atm.
Guess when cc.sys.isNative = true you could just go with Sprite3D class and create your object.
And when cc.sys.isNative = false you would have somehow to add a 3D object from WebGL to your actual Layer or Sprite subclass in Cocos2D-X(JS).
Post back, its always great when a topic comes to a conclusion and provides a solution in the end.
OK… so i went a way for a couple of months & played with some code libraries as discussed. Nothing earth shattering here; but these were my findings…
Goal: to have a web based view that would allow me to show 3D models/scenes online that would also be featured in my cocos2d-x app; such that a user could check them out online without having to download the app.
I had only really heard of three.js to this effect before; so I started with that… I found the tool chain a little dinky for converting files into three.js’s required json format; specifically the FBX->three.js converter. This tool hadn’t been updated in a few years & felt a bit stale / unsupported.
The first hurdle I ran into was the ability for three.js import scenes (as opposed to single meshes). Most FBX files when fed into the FBX conversion tools for three.js would result in many nodes (e.g. a scene instead of a mesh). The sceneloader for loading json files in THree.js is deprecated, and pretty delicate; my hack for this was to use the somewhat broken --flatten-scene flag for the three.js fbxconverter; this way it would make the file so that it can load using the regular three.js json loader.
The second hurdle I ran into was multiple texture files; by default, the three.js json loader only handles 1 file. To get multiples to load, I had to write custom shaders. My GLSL is pretty much non-existant so this didn’t make it very far; got something kinda working but the alpha was all messed up.
Frustrated, I started looking at other JS web GL frameworks.
I found Babylon.js and am happy with it so far. The tool chain seems much more robust for converting into babylon.js format; they have an unity5 exporter, blender exporter; and the regular command line tools are integrated with the autodesk fbx sdk, or alternately with the microsoft xbox XNA tool chain. Its very windowsy; so forget about it if you’re looking to convert files on a linux back end. With about 10 lines of code I was able to achieve exactly what I wanted; the loaded model always seems to be very close to its c3b counterpart when compared to cocos2d-x version. The framework seems to be getting regular updates also which is good… So that’s my recommendation.