Creating 3d text above an object in three js - javascript

I have 3D model which I have created in three.js. Based on some data, I want to create a text above each object of my scene.
It seems like I have one option which is creating a 3d text model and position it above my object , but this doesn't work with me i don't know if i had commited an error or something like that.
I'm wondering how to go about this. Which is the "correct" way to do this? Any suggestions and example code is very welcome!
here is my code
here is my problem

Related

How to rotate single element of 3d Model with Javascript

I am a three.js beginner and really impressed by the functionality of it.
I want to load a 3d model with three.js and rotate one element of this model with javascript (e.g. to rotate the hand of a human model or the door of a car model). Is this possible with three.js? Can you provide examples? Which 3d format/loader do you suggest for that purpose?
I tried to move parts of e.g. this model - however the object representing the model after loading it with
loader.load( 'models/3ds/portalgun/portalgun.3ds', function ( object ) {..
seems not to have a list of sub-elements which I can rotate....So I do not see a chance to select a sub-element of this model which I can transform (e.g. rotate). I am only able to transform (rotate) the complete model.
According to the documentation Object3d has a list of children but in my case it is always empty... Can you provide me an example?
The animation examples such as this seems not to use a loader...
Edit: E.g. how can I move the hand of this model in JS?
Thank you

Create column chart with sub elements for each bar

I need to create a data visualization in a web application, I wanted to use Highcharts since I have some previews experience, the problem is that the visualization I need to create is more custom, based on my investigation I'd need to use something like D3 which allows to do more things, but maybe someone has done something similar using a library with a smaller learning curve.
Is it possible to create a visualization like this (the image to the right) without using D3? Each of the small boxes inside the bars is an element that should be clickable to show it's details inside a card-like HTML element.
I saw this example with Highcharts, but it's not quite what I want and I'm not sure if what I need can also be done.
Thanks in advance for any help.

Three.js - How can I set up a callback on a clickable region - 3 js

I started with this tutorial and successfully managed to export my 3D model from blender to a json file which in turn was displayed on my html page using three.js. The 3d model is basically a simple human. Now I would like to define some clickable regions on the model (these clickable regions might be hands,legs,chest etc). I wanted to know what would be the best way to do that so that I would know which region is clicked. Will I have to define these regions in blender ? Are there any other approaches out there for accomplishing this task ?
look at this example showing object highlighting based on mouse position.

Three.js replacing "Teapot geometry model" with "JSON Model"

Been through the introduction tuturial. got the green cube working.
Replaced it with a json model. very exciting!
Then i tried to do the same with the teapot one. or the car.
Because i want a bit more detail and a texture on my model.
But for some reason nothing keeps showing up when i want to replace them.
With my own JSON model (exported from blender).
Also its hard to find any example that uses JSON.
Even the blender example does not use JSON for some reason.
I am trying to achieve a nice turntable effect for showcasing my models.
Would be even way more amazing if it had keyframe dragging below aswell for animating.
Links to examples:
http://threejs.org/examples/#webgl_geometry_teapot
http://threejs.org/examples/#webgl_loader_ctm_materials
Thank you for reading!

How to draw/write the text on/inside a 3D sphere object created using Three.Sphere Geometry in three.js

Here i will make it more clear. Actually i was working on creating three dimensional objects in three.js like sphere and now what i want to do is. I want to write some text on/inside the object at a particular location. I have tried in google but was unable to find out the exact sources. Can anyone please suggest me how can this be done ?

Categories

Resources