WebGL

Dragging and Clicking Objects with Controls

微笑、不失礼 提交于 2019-12-09 05:09:20
问题 Right now I have a scene with two spheres and a point light at (0,0,0). The spheres rotate around the point using Controls, but I can't get the spheres to move when I attempt to drag them. Can someone give my code a quick look, thanks! EDIT: Yes they move, but I need them to be draggable independently from the THREE.Controls, just like this example: http://mrdoob.github.com/three.js/examples/webgl_interactive_draggablecubes.html When a sphere is SELECTED, i need to prevent THREE.Controls()

Generate grid mesh

岁酱吖の 提交于 2019-12-09 03:58:46
问题 I need a mesh of quads so I can have 200x200 vertices and UV coordinates from 0 to 1 in both X and Y. I can't write this by hand, any way to generate such a mesh? 回答1: You can use loop to create this vertices array. Simple: for (var i = 0; i < 200; i++) for (var j = 0; j < 200; j++) { // fill our array here } 回答2: You want 200x200 vertices or 200x200 quads? with indices var positions = []; var uvs = []; var indices = []; var quadsAcross = 200; var quadsDown = 200; for (var y = 0; y <=

Using WebGL from inside a Web Worker: is it possible ? How?

久未见 提交于 2019-12-09 03:01:29
问题 I opened this matrix multiplication benchmarks and my browser (Firefox 7.0.1) froze until the benchmarks finished (I opened the page in an old Asus EeePC 1000H). I heard that web workers were invented to separate processing from displaying the web pages. Is it possible to make use of the Web Workers API to make WebGL not stall the whole web browser ? 回答1: Yes, on Firefox! https://hacks.mozilla.org/2016/01/webgl-off-the-main-thread/ We’re happy to announce WebGL in Web Workers in Firefox 44+!

hazy artefact on OS X WebGL on sides of volume rendering

谁都会走 提交于 2019-12-08 20:00:32
Does anyone know how to sort this weird effect? The sides of the volume we're trying to render seem artificially hazy. I'm running it on 2014 MacBook Pro, Intel Iris 1536 MB GPU, Yosemite v 10.10.2 (14C1514). I've heard that this is only a problem on machines running OS X, and it doesn't appear on Windows machines. I've also noticed it in some other places e.g. Leberba khronos.org/bugzilla/show_bug.cgi?id=1337 Bug reported so closing 来源: https://stackoverflow.com/questions/29493673/hazy-artefact-on-os-x-webgl-on-sides-of-volume-rendering

good file format for WebGL [closed]

﹥>﹥吖頭↗ 提交于 2019-12-08 19:13:42
问题 Closed. This question is off-topic. It is not currently accepting answers. Want to improve this question? Update the question so it's on-topic for Stack Overflow. Closed 6 years ago . There are many alternatives on 3D file formats, but i need smallest file size + textures at least? I've tried some but i need some advice? 回答1: I'm totally biased here (i'm a project member of what i'm suggesting), but you can use the Blender WebGL exporter with the JSON format... models are very small and it is

Is there a fast way to the average colors from several framebuffers in WebGL / Javascript?

独自空忆成欢 提交于 2019-12-08 18:17:29
I am very new to the WebGL subject. What I want to do is to calculate the average color of 6 different framebuffers like the ones below in the picture. Now I am wondering what the best way to go about it would be? I tried to do gl.readPixels(0, 0, 256, 256, gl.RGBA, gl.UNSIGNED_BYTE, pixelValues); but that seems to be very slow... Is there a way that this can happen on the graphics card? this is how the FBO is set up - I have this from a tutorial: ... You have two options Write a fragment shader that runs once per row (per texture) by rendering a quad (1 x textureheight) and runs through all

Rendering an image as a node in Three.js with SVGRenderer (or otherwise rendering spheres)

一笑奈何 提交于 2019-12-08 16:22:41
问题 I have a <circle> element in an SVG document, to which I apply a <radialGradient> to give the illusion of it being a sphere: <svg version="1.1" id="sphere_svg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="640px" height="640px" viewBox="0 0 640 640" enable-background="new 0 0 640 640" xml:space="preserve"> <defs> <radialGradient id="sphere_gradient" cx="292.3262" cy="287.4077" r="249.2454" fx="147.7949" fy="274.5532" gradientTransform=

Three.js - problems smooth shading a Lambert material on custom geometry

纵然是瞬间 提交于 2019-12-08 15:46:42
问题 I have created a custom geometry in Three.js. Now, I would like to create a mesh that uses a smooth-shaded Lambert material. Using a loop, I have created the array of vertices, then faces, and afterwards I have called geometry.computeCentroids(); geometry.computeFaceNormals(); geometry.computeVertexNormals(); var colorMaterial = new THREE.MeshLambertMaterial( {color: 0x0000ff, side: THREE.DoubleSide} ); var mesh = new THREE.Mesh( geometry, colorMaterial ); scene.add(mesh); The result is

WebGL Drawing an image

て烟熏妆下的殇ゞ 提交于 2019-12-08 15:26:08
问题 I'm new to WebGL, I've worked with OpenGL in Java before. I've been trying to code a simple function that draws an image on a specific location with a specific size and rotation. But after searching on the internet for a while, my code still isn't working. Currently, I've succeeded in drawing an image, but that image is not close to being in the correct location, having the correct size and rotation. I've lost my overview over what code does and needs what because I've used code from a number

Are 1D Textures Supported in WebGL yet?

我的未来我决定 提交于 2019-12-08 15:24:30
问题 I've been trying to find a clear answer, but it seems no one has clearly asked the question. Can I use a 1D sampler and 1D texture in WebGL Chrome, Firefox, Safari, IE, etc? EDIT Understandably 1 is indeed a power of 2 (2^0=1) meaning you could effectively use a 2D sampler and texture using a height of 1 and a width of 256 or 512 etc. to replicate a 1D texture. 1D textures are not moot, they exist because they not only have a purpose, but are intended to translate into optimizations on the