diwi/p5.easycam

A p5.js library for easy 3D camera control.

p5.easycam's Issues

renderer.pop() needs a style returned by renderer.push()

p5.EasyCam/p5.easycam.js

Line 1073 in 3ca874d

renderer.pop();

HUD can't be fixed with New p5 1.6 Version

HUD (HeadUp Display) rotates with EasyCam in New p5 1.6 Version.

Camera is not a function error

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)

PeasyCam Broken with p5.js v0.7.2 September 02, 2018

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)

HUD usage

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

Adjust camera movement

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

what is mouseDragPan()?

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....

NPM release?

Is there a release for p5.EasyCam on npm or is this project built specifically for the global window namespace?

written for node_modules

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?

New release of p5.EasyCam available

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

Getting 3D world position of mouseX and mouseY on specific plane

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

Rotations around world axes

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!

EasyCam not working for p5.js 0.9.0!

I have tried to use EasyCam but the canvas doesn't show when I use easycam

Here is my code:

var easycam;

function setup() {
  createCanvas(400, 400, WEBGL);
  easycam = createEasyCam();
}
function draw() {
  background(0);
  lights();
  box(100);
}

Here is screenshot:

Submit to be included on the p5.js website's libraries page

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

Codesandbox "n.camera is not a function"

Hi, I have the "Camera is not a function error" issue similar to

#11
#5

in codesandbox.

p5.easycam.min.js:1 Uncaught TypeError: n.camera is not a function

The fix from #5 solves it but may be you can look into this. Thanks C.

Dw.EasyCam is not defined p5.js & Vue.js Integration

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.

Thanks in advance!

Limiting rotation angles

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!

BUG FOUND AND FIXED: dwgl.js bug in uniformT

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++;
    } 
  }

HighDPI handling

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...

Mouse scroll zooming is not working on safari

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.

is full screen available only?

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)

Does not work properly with meshes.

When I load a mesh in scene and try to change camera orientation the mesh starts flickering.