diwi / p5.easycam Goto Github PK
View Code? Open in Web Editor NEWA p5.js library for easy 3D camera control.
Home Page: https://diwi.github.io/p5.EasyCam/
License: MIT License
A p5.js library for easy 3D camera control.
Home Page: https://diwi.github.io/p5.EasyCam/
License: MIT License
I'm currently using webpack imports and exports loader to get this to work.
Can this be written with es6 exports ?
Maybe as a node_module as well?
hi there, it seems there is a problem with high DPI displays. i don't know if it's related to easycam or p5.js or even webgl itself. any suggestion? any idea?
@diwi thanks in advance...
In dwgl.js
the uniformT
function does not work when you try to pass more than 1 texture as uniforms to a fragment shader. I have discovered the fix. You need to make the texture active BEFORE you bind it. The fixed function is below. The two lines that need to be switched are the gl.activeTexture
and gl.bindTexture
lines, which currently are lines 630 and 631 in dwgl.js
.
FIXED FUNCTION:
uniformT(name, val){
var gl = this.gl;
var loc = this.uniformLoc(name);
if(loc){
gl.activeTexture(gl.TEXTURE0 + this.tex_loc); // these are the two lines
gl.bindTexture(gl.TEXTURE_2D, val); // that needed to be switched
gl.uniform1i(loc, this.tex_loc);
this.tex_loc++;
}
}
HUD (HeadUp Display) rotates with EasyCam in New p5 1.6 Version.
Peasy cam doesn't load with the simple example provided in the readme - any ideas?
Uncaught TypeError: renderer.camera is not a function
at EasyCam.apply (p5.easycam.js:608)
at EasyCam.update (p5.easycam.js:591)
at p5.easycam.js:429
at callMethod (p5.js:55140)
at Array.forEach (<anonymous>)
at p5.redraw (p5.js:55148)
at p5.<anonymous> (p5.js:48840)
at p5.<anonymous> (p5.js:48742)
at new p5 (p5.js:49029)
at _globalInit (p5.js:48414)
hi every body... i was trying to use HUD option with beginHUD and endHUD... there was no error, but nothing was shown... this is my code:
mainCam.beginHUD(RENDERER,500,500);
mainCam.endHUD(RENDERER);
i found the below error in p5.js:
Uncaught (in promise) TypeError: Cannot read property 'mat4' of undefined
at p5.Shader._setMatrixUniforms (p5.js:81305)
at p5.Shader.bindShader (p5.js:81248)
at p5.RendererGL.drawBuffers (p5.js:79721)
at p5.RendererGL.rect (p5.js:74662)
at p5.rect (p5.js:53387)
thanks in advance
@diwi
I am getting the following error, the fix in [https://github.com//issues/5] does not resolve.
p5.easycam.min.js:1
Uncaught TypeError: n.camera is not a function
at f.apply (p5.easycam.min.js:1)
at f.update (p5.easycam.min.js:1)
at p5. (p5.easycam.min.js:1)
at callMethod (p5.js:14109)
at Array.forEach ()
at p5.redraw (p5.js:14112)
at p5. (p5.js:9147)
at p5. (p5.js:9043)
at new p5 (p5.js:9323)
at _globalInit (p5.js:5602)
HI again everybody :-)
how can i limit the rotation angles? i mean for example no less than 5 degrees around x axis?
thank you in advance
@diwi please help!
Is there a release for p5.EasyCam on npm or is this project built specifically for the global window namespace?
First of all I must tell you that this is fantastic, congratulations for such a nice work.
I have an issue that I'm not sure if can be corrected via configurarion. This is the scenario:
See this demo and this one, On both examples drag the mouse following this pattern
What you should see is that with three.js the object moves slowly following more accurate the mouse, whereas with EasyCam the object moves faster and rotating in other axis.
For example, if I move the mouse only horizontally, in three.js the object moves in that plane, but if I perform the same movement with EasyCam the object kind of start wobbling
This repo appears to be abandoned. The currently supported version of p5.EasyCam is now available as a community library on the p5.js website! The new release works correctly with p5.js v0.9+ and includes a fix for HUD. Also, in the readme of the new repo, there is a link to a new tutorial series on how to work with EasyCam in OpenProcessing. Any new issues should be posted in the repo here: https://github.com/freshfork/p5.EasyCam
Hi,
Thank you for this great work. I used to use three.js. But with this i could not be happier to code everything with p5.
I noticed on my rMBP 2015 on Safari 11.0.3 when using gesture of mouse scrolling on my trackpad (equivalent to mouse wheel) zooming is not working. Work fine on Chrome v.64.0.3282.167 on the same machine.
Line 1073 in 3ca874d
Submit to be included on the p5.js website's libraries page
I feel like this would be helpful, especially to get in front of student's eyes. In my classes, students have a hard time traversing the endless JavaScript library terrain, and having a concise starting location like the p5 website is super helpful.
Submit to be included here:
https://docs.google.com/forms/d/e/1FAIpQLSdWWb95cfvosaIFI7msA7XC5zOEVsNruaA5klN1jH95ESJVcw/viewform
Hi,
I am trying to use the code, but I need to use as not in full screen. ( I need to save some space to another DOM elements. like file drop....)
I have changed the (windowWidth, windowHeight,) into the Quickstart example, but nothing had happened.
Even is it possible to fix the canvas size?
If it is not can I request this option into the future.
(I am beginner and I apologize for simple question)
Hello,
I`m using p5.js with Vuejs framework. It works fine but when I try to add easyCam library, it show that Dw.EasyCam is not defined. I do import 'p5/lib/p5.easycam'; library as needed in Vue.js.
p.setup =_=> {
this.canvas = p.createCanvas(innerWidth, innerHeight, p.WEBGL)
this.easycam = new Dw.EasyCam(this._renderer, {distance : this.lunarDistance*1.3})
this.canvas.parent(this.$refs.canvas)
}
Please help me with this issue.
When I load a mesh in scene and try to change camera orientation the mesh starts flickering.
hi everybody... does anyone know what is mouseDragPan()? i don't understand this: "implemented pan-cb for mousedrag/touch handler." as a description for this function...
anyway i want to set some constraints on mousewheel zoom, such that disable zooming in or out more than a defined value. i thought mouseDragPan might be related to it... thanks people....
hi everybody, i'm badly stuck here trying to solve the title of this issue... i tried so many different algorithms but i can't get it right... i don't know what do to this about this one... can anyone please help?
and i guess it might be a good additional function for this library... it would really appreciate any kind of help...
@diwi and anyone who can help!
thanks again
Hey there,
Thanks a lot for this plugin, it's really helping out!
I'm using p5 for a visualization for a project, but I'm having trouble making an orbiting camera that stays upright. By that I mean having no roll and and making yaw rotation around the world coordinates instead of the camera coordinates, like you would see in any video game where you see the world from above or even when you look around in Blender. I have tried many approaches but haven't managed so far, do you have any idea?
Thanks a bunch!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.