Tag: webgl
WebGL erweitert die Fähigkeiten von HTML-canvas-element, um es zu Rendern accelerated graphics in jedem kompatiblen web-browser.
**NICHT TAG FRAGEN ÜBER 3D-BIBLIOTHEKEN (wie THREE.js MIT DIESEM TAG** es sei denn, die Frage ist speziell über eine WebGL-API-Funktion
Wie kann ich methodisch wählen Sie den clip in der Nähe von dem Flugzeug Entfernung für eine perspektivische Projektion?
3 Antworten
Habe ich eine 3D-Szene und eine Kamera definiert mit gluPerspective. Ich habe einen festen FOV, und ich weiß, dass der Mindestabstand von jeglicher geometrie, die für die Kamera (es ist ein first-person-Ansicht, so dass der minimale Abstand
Wie führen Sie das Mipmapping in WebGL?
1 Antworten
Ich bin learning WebGL und Lesen das Buch "WebGL Programming Guide'. Doch das Buch hat ausgelassen das Thema der textur-MIP-Mapping. Ich habe versucht, zu suchen, die die offizielle OpenGL-ES-website, aber konnte nicht scheinen, um eine Antwort auf
Erhalten Sie genaue integer-modulo in WebGL-shader
3 Antworten
Möchte ich, um eine genaue modulo der x und y in einem WebGL-fragment-shader. x und y ganze zahlen sind. Grafik mod(x,y), erhalten wir die folgenden: Den eigentlichen code, der verwendet wird zum generieren der roten-und-schwarzen-Rechteck: gl_FragColor =
Aktualisierung ShaderMaterial-Attribut in three.js
1 Antworten
Aus der three.js tutorial über Shader, wir lernen, wir können aktualisieren, einheitliche Werte einer ShaderMaterial: var attributes = { displacement: { type: 'f', //a float value: //an empty array } }; var uniforms = { amplitude:
WebGL: INVALID_OPERATION: uniform1i: Standort nicht zum aktuellen Programm
1 Antworten
Ich versuche zu setup zwei Texturen in meinem fragment-shader, bin aber immer diese Fehlermeldung, wenn ich versuche setup die entsprechende uniform-Variablen mit: gl.uniform1i(getUniformLocation(program, "uTextureOne"), 0); und gl.uniform1i(getUniformLocation(program, "uTextureTwo"), 1);. Was bedeutet es? (Ich verwende Chrome) Mein shader
Kann man ganz einfach erstellen Sie ein HTML-Bild-element aus einem WebGL-textur-Objekt?
3 Antworten
Ich würde gerne ein WebGLTexture Objekt, das habe ich wiedergegeben und es verwenden, um erstellen Sie ein HTML-Bild-element. Das Ziel ist die Darstellung der Ergebnis eine offscreen-rendering-pass für debugging-Zwecke. Es sollte viel einfacher sein, als das Rendern
Ab Cinema 4D [R13+] und Three.js
1 Antworten
Bin ich einfach nur zu starten, um das erstellen eines 3D-website, und ich bin mit Cinema 4D. Nun ist meine Frage, wie kann meine 3D-Modelle auf meiner website? Sie weisen zu verwenden Py4d - ein plugin, aber
Three.Js zeichnen linearer Farbverlauf textur in webgl
1 Antworten
Mit canvas-renderer verwende ich eine Funktion, die zieht einen linearen Verlauf. Ich möchte diese Arbeit mit der webgl-renderer als gut, aber es drosseln auf Transparenz. Der code ist unten und hier ist ein link zu ein Turnschuh,
THREE.js - Nicht Lesen-Eigenschaft 'lib' undefined (DREI.ShaderUtils.lib["normal"])
2 Antworten
Arbeite ich durch die übungen fanden in der WebGL-erste-Schritte-Buch von Oreilly. Die folgende Zeile verursacht einen Laufzeitfehler. Ich gegoogelt um und nicht sehen, alle anderen haben das Problem, also was mache ich falsch? var specularMap= THREE.ImageUtils.loadTexture("WebGLBook/images/earth_specular_2048.jpg"); var
THREE.js Renderer
2 Antworten
Kann mir jemand erklären, was ist der Unterschied zwischen three.js Renderer? Welches ist schneller? Die eine ist mehr standard-und cross-browser? Wie der svg-renderer und dom-renderer arbeiten? Ich habe anderes Ergebnis, wenn ich webGl statt der canvas-renderer für
Aktivieren einer Erweiterung auf eine Three.js shader
2 Antworten
Wie kann ich die Erweiterung aktivieren auf ein Three.js shader? Mein code bisher: erste Erweiterung: var domElement = document.createElement( 'canvas' ); var gl = domElement.getContext('webgl') || domElement.getContext('experimental-webgl'); gl.getExtension('OES_standard_derivatives'); auf meinem shader: fragmentShader: [ "#extension GL_OES_standard_derivatives : enable",
Three.js als hintergrund der website möglich?
4 Antworten
Habe ich mit three.js für ein lustiges experiment auf einer Website. Ich würde gerne auf einen aktuellen Test (für die ich bereits den code für), und verwenden Sie es als hintergrund für meine Website. Weiß jemand, wie
WebGL - render-Tiefe fbo-textur funktioniert nicht
2 Antworten
Für ein post-processing-shader, brauche ich die Farbe und den depth-buffer meiner framebuffer. Zugriff auf den colorbuffer funktioniert einwandfrei, aber ich habe Probleme beim erstellen der depthbuffer. Ich bekomme immer einen INVALID_ENUM Fehler, wenn Sie versuchen zu verwenden
Die WebGl-Unterstützung für android & iphone webviews
2 Antworten
Als ich ging durch verschiedene demos zu WebGL online, ich wirklich das Gefühl, es ist sehr gut für den mobilen GL rendering, aber da es ein sich entwickelndes Konzept, es ist die Unterstützung auf mobilen befragt. So
Gibt es eine WEBGL-Handbuch?
8 Antworten
Gibt es irgendeine Art von WebGL-Handbuch, listet alle Funktionen etc. ? Ich habe versucht, Google aber nix gefunden. Du meinst so etwas wie dieses: khronos.org/registry/webgl/specs/1.0 ? Dieses tutorial könnte helfen, eine Menge, wie in meinem Fall. webglacademy.com
Three.js die lookAt-Funktion Problem
2 Antworten
Erstellte ich einen Kegel mit einem Zylinder-geometrie. Dann, wenn ich will drehen Sie den Konus auf die positive Richtung der X-Achse mit lookAt-Funktion, es funktioniert einfach nicht. Gibt es etwas falsch mit meinem code? Oder ist dies
Wie packt man einen 32bit int In 4, 8bit ints in glsl / webgl?
3 Antworten
Ich bin auf der Suche zu parallelisieren, einige komplexe Mathematik, und webgl sieht aus wie der perfekte Weg, es zu tun. Das problem ist, Sie kann nur Lesen 8-bit-Ganzzahlen von Texturen. Ich würde am Liebsten auf 32
Wie zu erkennen, Kollision in webgl?
4 Antworten
Zu erkennen, wie die Kollision in webgl, ohne die Verwendung einer Bibliothek wie three.js? Dies kann hart sein zu tun. Wie auch immer, warum don ' T Sie wollen eine Bibliothek für seine? Ich bin auch anti-library
Partikelsysteme Tutorial/Intro in Three.js
1 Antworten
Ich habe versucht zu finden, einige gute tutorials über Partikel-Systeme in Three.js,, aber noch nicht in der Lage, etwas zu finden, bemerkenswert. Gibt es eine Partikel-engine, dass wäre einfach zu bedienen, für die es, vielleicht mit ein
Wählen Sie Netz auf Three.js
2 Antworten
wissen Sie, wie kann ich wählen Sie eine geometrie mit Three.js? hab Sie noch nie gesehen so etwas? Suchte ich für viele Tage, aber alle Beispiele, die ich gefunden habe funktionieren nicht und sind legacy-codiert. Ich müsste
Mithilfe von Matrizen zu transformieren Three.js scene graph
2 Antworten
Ich versuche, eine Szene laden aus einer Datei in Three.js (benutzerdefiniertes format, nicht eine, die Three.js unterstützt). Dieses format beschreibt eine Szene, graph, wo jeder Knoten im Baum hat eine Transformation angegeben, wie eine 4x4-matrix. Der Prozess
Three.JS Zuweisen von Farbe zu Objekt
1 Antworten
Möchte ich hinzufügen, ein material/eine Farbe auf ein Objekt geladen, aber ich weiß nicht die genaue syntax besser gesagt, was vars und Funktion sollte ich hinzufügen. Wenn ich diese Zeile oben, dann zeigt er das Objekt, sondern
Lesen Sie Pixel aus einem WebGL-textur
1 Antworten
Ich habe eine WebGLTexture Objekt. Wie bekomme ich die Pixel der textur (ähnlich wie WebGL ist readPixels, aber für eine textur)? Eine Idee, die ich habe, ist zum erstellen ein canvas-und WebGL-Kontext mit preserveDrawingBuffer=true, und render meine
ThreeJS Textur ist pixelig, wenn man Sie aus der Entfernung
1 Antworten
Spielte ich mit webGL und ThreeJS, dann hab ich das folgende Problem: Texturen mit großen Bildern wird pixelig, wenn man Sie aus der Entfernung. Überprüfen Sie die Beispiel: http://jsfiddle.net/4qTR3/1/ Unten ist der code: var scene = new
Wie Sie korrekt zu Rendern deckungsgleiche Polygone in OpenGL (ES)
4 Antworten
Ich verstehen, dass durch die Einstellung der Tiefe Funktion in OpenGL ES-man kann Steuern, wie überlappende Geometrien werden in einem gerenderten 3D-Szene. Ich benutze gl.depthFunc(gl.LEQUAL) (webgl) in meinem code. Jedoch, wenn zwei Gruppen von Polygonen sind deckungsgleich
Kann mir jemand erklären, was dieses GLSL fragment shader ist zu tun?
1 Antworten
Merke ich, dies ist ein Mathe-centric Frage, aber... wenn man sich diese Webseite (und eine gute Grafikkarte) http://mrdoob.github.com/three.js/examples/webgl_shader.html Wenn Sie einen Blick auf die Quelle, werden Sie feststellen, eine beängstigend aussehende fragment-shader. Ich bin nicht auf der
Wie funktioniert die Vermischung der Arbeit mit GLSL ES-fragment shaders in WebGL?
3 Antworten
Ich versuche, eine einfache Wirkung, um die Anzeige mit Hilfe von WebGL lassen. Natürlich, dies bedeutet, ich bin mit dem fragment-shader Sprache definiert, in der GLSL ES 1.0-Spezifikation. Den code, mit dem ich arbeite, ist weitgehend aus
Three.js OBJLoader .obj-Modell keine Schatten
1 Antworten
Arbeite ich an einem Projekt, wo ich wünschte zu ermöglichen .OBJ-Modell geladen OBJLoader.js Schatten von einem Scheinwerfer. Das Licht wird zu Schatten von anderen normalen Gegenständen, sondern die .OBJ wird nicht scheinen, um Schatten zu werfen. Ein
Die Vorgehensweise zum binden eines array mit Strukturen an ein WebGL-shader-uniform?
1 Antworten
Ich brauche, um zu behandeln viele Objekte, die teilen sich nur ein paar Texturen. Definieren und laden von Texturen nacheinander manuell (wie beschrieben in ein weiterer Beitrag auf SO) nicht das Gefühl hat Recht... noch mehr so,
Be-Maya-Modell mit Three.js
1 Antworten
Ich bin nach diese tutorial auf, wie zu laden, Maya Modelle mit Three.js. Alles in Ordnung ist, aber die Anleitung wird nur erklärt, wie Sie die Last Modelle mit einer textur. Hier ist der source-code aus dem
Aktivieren Sie WebGL in Android WebView
1 Antworten
Aktivieren von WebGL in der WebView-widget für Android 5.1.1 emulator? Ich überprüfte die WebGL-status durch Webglreport und das Ergebnis war "Dieser browser unterstützt WebGL, aber es ist deaktiviert oder nicht verfügbar. Manchmal ist dies das Ergebnis der
Anzeigen von VRML-Datei mit WebGL-fähigen browser
3 Antworten
Ich habe eine ältere Anwendung, die generiert VRML 1.0-Dateien. Ich möchte bauen ein WebGL-basiertes web-interface anzeigen kann diese VRML-Dateien. Gibt es eine einfache Möglichkeit, dies zu tun? Edit: Angegeben ist, dass Sie VRML 1.0. Ich denke, Ihre
Jede Freie open-source-WebGL-Editoren?
4 Antworten
Zuerst, ich entschuldige mich für mein schlechtes Englisch. Unser Entwicklungs-team arbeitet an einem Projekt, geschrieben in GWT ermöglicht den Benutzern das kollaborative Umgebung. Benutzer können an unterschiedlichen Projekten arbeiten, einschließlich animation-Herstellung, Bildbearbeitung, 3D-Struktur-Modellierung und so weiter. Also
Die WebGL-framework soll ich lernen?
2 Antworten
Ich einen Rahmen finden Liste auf http://www.khronos.org/webgl/wiki/User_Contributions#Frameworks Jedoch, was unterscheidet Sie? Ich Las einige Artikel sagte, WebGL wird angetrieben von low-level-Sprache, die WebGL-Framework machen es gerade für high-level-Sprache, um die einfache Umsetzung. Ich bin schon viel jQuery,jQueryUI,
Wie kann ich Reflexion in three.js?
1 Antworten
Ich will eine reflektierende Würfel Oberfläche in eine WebGL-Seite mit Three.js. Es sollte Aussehen wie ein Handy-display, das spiegelt etwas Licht, aber es hat immer noch, schwarz zu sein. InformationsquelleAutor Applecow | 2012-07-06
bufferData - usage-parameter Unterschiede
1 Antworten
Beim Lesen der Spezifikation an Khronos, die ich gefunden habe: bufferData(ulong target, Object data, ulong usage) 'Gebrauch' parameter kann sein: STREAM_DRAW, STATIC_DRAW oder DYNAMIC_DRAW Meine Frage ist, welche soll ich verwenden? Was sind die Vorteile, was sind
Die Leistung von WebGL und OpenGL
4 Antworten
Für den letzten Monat ich ' ve wurde Herumspielen mit WebGL, und festgestellt, dass wenn ich das erstellen und zeichnen Sie ein großes vertex-buffer, die es verursacht niedrige FPS. Weiß jemand, ob es das gleiche wenn ich
WebGL mit gl-matrix-Bibliothek mat4.übersetzen wird nicht ausgeführt
2 Antworten
Habe ich in diesem segment code: function setupWebGL() { gl.clearColor(0.1, 0.5, 0.1, 1.0); gl.clear(gl.COLOR_BUFFER_BIT); gl.viewport(0,0,400,300); mat4.perspective(45, 400 / 300, 0.1, 100.0, pMatrix); mat4.identity(mvMatrix); mat4.translate(mvMatrix, [0, 0, -2.0]); } Und alles, was im code ausgeführt wird, mit Ausnahme
First-person-simulation mit three.js mit der Tastatur Pfeile
3 Antworten
Für meine Quelle, besuchen http://jsfiddle.net/fYtwf/ Hintergrund Habe ich eine einfache 3d-simulation mit three.js wo die Kamera ist umgeben in 3 Dimensionen Würfel schneiden. Diese Würfel sind zu helfen, zu visualisieren, wo die Kamera schaut, bis der Blick
Ändern vertex buffer dynamisch in WebGL
1 Antworten
Entwickle ich ein Tuch simulator in WebGL, hab alle Physik und der animation fertig, aber ich kann einfach nicht machen es. Ich bin es gewohnt zu verwenden glVertex in Opengl, also in jeder iteration ändern kann ich
Reflektierendes material in THREE.js
1 Antworten
Wie kann ich ein material, das spiegelt sich auch andere Formen aus der Szene? Ich habe versucht die reflectivity Eigenschaft, aber es hat nicht reflektieren nichts. Es ist ein Beispiel, das scheint, um diesen Effekt zu haben:
Das wiederholen der textur-map, wie GL_REPEAT?
3 Antworten
Ich habe ein Haus-Modell in meinem Spiel, und ich habe einige Materialien für die Haus-geometrie. Es ist ein material für die Wand des Hauses, und ich habe ein textur-map-Bildes zu zeigen, die Steine. var mat = new
Zeichnen Sie ein Bild mit WebGL
2 Antworten
Könnte bitte jemand erklären, wie das zeichnen eines Bildes auf einem WebGL-canvas? In dem moment, in regelmäßigen '2d' Leinwand, ich bin mit diesem: var canvas = document.getElementById("canvas"); var cxt = canvas.getContext('2d'); img.onload = function() { cxt.drawImage(img, 0,
Warum ist es notwendig, Präzision für den fragment-shader?
2 Antworten
Ich lernen WebGL. Neben Shader funktionieren: //vertex.shader //precision mediump float; attribute vec4 a_Position; attribute float a_PointSize; void main(){ gl_Position = a_Position; gl_PointSize = a_PointSize; } und //fragment.shader precision mediump float; uniform vec4 u_FragColor; void main(){ gl_FragColor =
Ändern Sie die textur geladen .obj in three.js zur Laufzeit
1 Antworten
Ich versuche zu tauschen, Bild-textur zur Laufzeit auf eine geladene three.js .obj. Hier ist der code gerade aus three.js Beispiele mit geringfügigen änderungen: var container, stats; var camera, scene, renderer; var mouseX = 0, mouseY = 0;
Müssen die Geschwindigkeit meiner SVG. Könnte ich konvertieren, um WebGL oder canvas?
3 Antworten
Habe ich eine SVG-Zeichnung mit 10138 Teile, so dass es langsam ausgeführt wird. Ich will es mehr wie http://workshop.chromeexperiments.com/globe Hier sind die Lösungen/Fragen, die ich überlege mir Gibt es eine Möglichkeit zu haben, die SVG-Teile Rendern in
WebGL Geometrie-Shader-Äquivalent?
2 Antworten
Ich bin derzeit auf der Suche nach einer Möglichkeit zur Herstellung von non-photorealistic rendering in webgl. Den besten Algorithmus, den ich bisher gefunden habe, für Rand-Erkennung wurde implementiert mit OpenGL geometrie-shader, hier. Speziell GL_TRIANGLES_ADJACENCY. Ich Frage mich,
Wie cast von int zu float in GLSL (WebGL)?
1 Antworten
Mein code ist (innerhalb des void main): float res; for(int i=0; i<15; i++) { res = float(i)/15.0; //... } Leider bekomme ich einen Syntaxfehler bei float(i)/15.0 Wenn ich nur schreiben i/15.0, dann die Fehlermeldung: wrong operand types
Eine-Szene, sondern in mehrere Ansichtsfenster mit der eigenen Kamera (three.js)
2 Antworten
Habe ich eine Szene, die ich wiederverwenden möchten, Rendern Sie die Szene in zwei divs, die mit einer anderen Kamera-Winkel für die einzelnen div. Dieser link sagt, eine Szene, die nicht geteilt werden kann zwischen mehreren Renderern,
gl_FragCoord.x -, y -, z 1 für alle Pixel und w die Tiefe
1 Antworten
Ich bin mit THREE.js mit shader. Ich versuche, den zbuffer Informationen. Vertex-shader: //switch on high precision floats #ifdef GL_ES precision highp float; #endif void main() { gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0); } Fragment-shader: #ifdef