Comments (1)
Well this was a simple error indeed, the correct code for the vert and frag variable must not have semi-colon after the bracket of the main function and it must be specified that the main function doesn't return anything with the "void" keyword.
For those interested this way work to show a simple color in a Svelte component :
<script>
import GlslCanvas from 'glslCanvas'
import { onMount } from 'svelte';
let gl, canvas
const vert = "attribute vec4 a_position;\n void main(){\n\tgl_Position = a_position;\n}\n\n"
const frag = "void main(){\n\tgl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);\n}\n\n"
onMount( () => {
gl = new GlslCanvas( canvas )
})
</script>
<div width="100%">
<canvas bind:this={canvas}
class="glslCanvas"
data-vertex={vert}
data-fragment={frag}
width="100"
height="200"></canvas>
</div>
After that I still have warnings about :
GlslCanvas.es.js:1050 WebGL: INVALID_VALUE: enableVertexAttribArray: index out of range
and :
GlslCanvas.es.js:1051 WebGL: INVALID_VALUE: vertexAttribPointer: index out of range
from glslcanvas.
Related Issues (20)
- Video feedback demo
- webcam
- How to use glsl version 3.00 HOT 1
- setUniform not working HOT 4
- Is it possible to force a lower framerate than 60? HOT 2
- GL Canvas Back to MediaStream results in black frames.
- Adding webgl2 support and other future releases.
- Is it possible to draw vertex data (i.e. gl.drawArrays)?
- Multiple shader passes
- setMouse / Faulty mouse coordinates HOT 2
- Load and render a single frame may fall into a blank
- u_mouse causing flashing in shader
- In the browser html showing black color.
- 'mousemove' event listener never released
- Rawgit no longer exists HOT 1
- Unable to import via es6 module
- Load shader as a external file HOT 1
- WebGL warnings in Firefox
- Issue when calculating normals
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from glslcanvas.