Getting a text included in a Mesh - three.js

i need some help in my webGL code.
I created a TextGeometry and i included it in a mesh, i didn't have any problem about that. However, i would like updating this text without creating another TextGeometry.
Indeed, my main goal is to translate a text (from right to left) and to make it disappear when he reaches to the left side, but only character by character (like a fade effect).
I tried some attempts : for example, according to text position, deleting it with a :
scene.remove(text)
and creating another text which is the same as previously minus the first character. I don't know if i was clear... But this solution makes my application very slow : that's why i don't want creating an Object every time, but just updating his text property.
I didn't find many help in three.js documentation, may you give me a hand about that ?
Cheers

You could try this:
Create a PlaneGeometry and texture it using the image from a hidden canvas object that contains your text, then apply image transforms to the canvas itself (fading as necessary) and continually update the texture in Three.js as it moves across the scene.
For an example of how to use a canvas object as an image (of text), I have an example posted at: http://stemkoski.github.com/Three.js/Texture-From-Canvas.html

Related

Sprite sheet used for diffuse animation

I'm trying to use a sprite sheet in my background animation. The sprite sheet is made up of multiple objects of varying sizes and shapes. I want the sizes/shapes to be used consecutively in a "floating" type backgound animation. I have no clue how to start the code. Can't seem to find anything like this on the Stack Overflow site. Ps. I'm not trying to animate one (1) object (such as a running man). Please HELP!!
I tried using JS code for animating bubbles and just replacing with my script.png. It didn't work. The example background that I'm trying to duplicate is found at https://lusion.co - If you page down until you reach about the third page, you will find a colored background with floating objects, along with a scattered light and fog. Lusion used a sprite sheet for the objects. I have a copy of the sprite sheet. They seem to hide their code, so I can't use their site for learning.

How to fix image texture not transfering to Unity from Blender

I textured an object in Blender because it wouldn't texture properly in Unity, and then imported the object and texture to Unity.
I don't know how to fix this, I'll put both pictures here.
Blender Texture Before Import
Object In Unity
Okay, so based on your screenshots..
You're going to select everything then add a modifier called "Solidify", then set this to something very small like .03. (Unity doesn't like objects that are just planes).
double check all your normals are facing out. Let me know if you don't know how to do this...
Go into edit mode select all edges, then right click, select "mark as seam".
Open UV editor window (should be split screen with Edit mode on one side, UV view on the other). In the Edit side select all, then go to UV dropdown menu and click "unwrap". You should then see your object unfolded into flat planes over on the UV window side. There's different unwrap options, like smart UV unwrap, etc. I think just "unwrap" has worked for me, but play around and there may be something that shows your object shapes in a less distorted way..
At this point, since your pattern is basically repeating. If you export the OBJ file and take it into unity, and you add the image file (make sure it's dimensions are perfectly square) it should receive the image file as an Albedo texture much better than in your screenshots. You can play with the 'tiling' and "X/Y offset" till it looks right (you might face issues with rotation though.
BUT
If you want to line it up very specifically, you can export the UV layout as a png from the UV window in blender. Then use photoshop or another photo editor to change/rotate and arrange your texture so the sides line up properly. In blender in the Edit window (assuming you still have both UV + editor open) when you select a side it will highlight in the UV window the corresponding flat plane, based on this you should be able to figure out what should be rotated up/down, etc. Then when you change that 2d image and drag it into Unity, it will adjust and wrap around the object.
I'm pretty new to both, but the advice I've been given is to not do the texturing in blender, but instead to do it in Unity.
This is a 10-month-old post but incase anyone is curious or struggling the same, Blender exports models with a scale of 100 so you need to scale up the tile of the material (in material settings) to see it.
This is a bad solution however because then you are not working with objects on a scale of 1 so you actually want to check "Apply transformations" when exporting the FBX model in blender

Unable to Move the Canvas or Change Any of the Transform Values

I am using Unity 5 and I started to make a menu scene. When I made the canvas, all of values under the Rect Transform component are locked and it says "some values driven by Canvas." The only thing I can change is the z position when using the gizmo in the editor. I can't reset the position or anything. Why is this happening?
This means that the canvas's canvas component has it's render mode set to Screen space - overlay. This forces it to be the size of the screen. Change it to World Space and it will allow you to resize it and move it around.
Changing the Render mode is not an ideal solution; neither is Overlay mode the reason why this is happening at all. World Space is just a render mode that changes the way your whole UI behaves and would mean a whole different set up and a whole lot more work just to get a child UI object to move independently.
Here is the description of what World Space is for from the Unity site:
In this render mode, the Canvas will behave as any other object in the
scene. The size of the Canvas can be set manually using its Rect
Transform, and UI elements will render in front of or behind other
objects in the scene based on 3D placement. This is useful for UIs
that are meant to be a part of the world. This is also known as a
“diegetic interface”.
The Rect Transform usually gets locked because it is a child of another Canvas Object which controls its Transforms. The way to fix this is to overwrite it by adding a “Layout Element” component to it. From there you can configure it to work the way you like and it can have transforms independent of the Parent UI Object.
For full details, see this Unity support page: https://support.unity3d.com/hc/en-us/articles/115000179163-How-to-overwrite-Width-and-Height-values-that-are-driven-by-a-Layout-Group-in-runtime-
Canvas is depend on game tab in your window panel.
Adjust panel by use of close tab or resize panel or doc game panel.
It will help you make default 800 X 600 canvas.

How do I attach a text to the vertices of a cube in three.js? Also, Can I add a Text at any point inside the Cube?

I am trying to create a cube using three.js for a project. I need to add text to vertices and at different points inside the cube. Any idea how this can be done?
For some basic code examples of using Sprite objects in Three.js, check out:
http://stemkoski.github.com/Three.js/Sprites.html
And for an easy way to create images that contain text to use as your sprite textures, check out the sample code at:
http://stemkoski.github.com/Three.js/Texture-From-Canvas.html
I think a combination of these two ideas will achieve what you are looking to do.
If you want to have label-style texts, so that the text begins at a specific point, but is always oriented with the camera and easily readable no matter the camera position, you can use sprites. (example of canvas-created text label sprites: http://i.imgur.com/e9I68xD.jpg - here they are rendered on a separate pass to that they are never obscured by the scene but you can do it on the same pass)
If that's what you are looking for, I'd suggest first checking the Sprites examples, and learn to attach some static image as a sprite to correct position in the scene. After you get that working, you modify the code so that you generate the text to an image canvas using standard Javascript Canvas functions, and using that image as the sprite.

How to prevent LATEX-labels in MATLAB GUI to become blurry?

Within my current MATLAB GUI project, i have two axes objects. The first is used by the workaround "uibutton" (I don't use GUIDE) in order to display a LaTeX-formula (as far as I know, only axes labels are capable to use LaTeX whereas normal static text fields aren't...). The other axes object is used to actually plot a 3D-function.
The program has the following steps:
the first axes creats the LATEX-formula (e.g. f(x)=).
User enters a function in the edit field after the LaTeX-formula (e.g. f(x)=a+b).
User presses a "plot"-button.
3D-function is plotted in the second axes object.
Problem:
As soon as the 3D-function is plotted, the nicely rendered LaTeX-formular becomes crisp. Is there any way to prevent this from happening?
http://i42.tinypic.com/348pq2u.png (See picture for problem demonstration)
Check your figure properties before and after you draw the 3D plot
get(gcf, 'renderer')
My guess is that plotting the 3D function changes the renderer from the default ("painters") to another (likely OpenGL). Matlab's Latex rendering does not seem to play well with zbuffer or OpenGL (these produce bitmaps rather than line art).
You may be stuck if painters can't render your 3D graphics properly, but you can try to force it by setting the renderer manually back to painters
set(gcf, 'renderer', 'painters')

Resources