Comments (2)
this will work
export default (props) => {
// colorTeal;
// console.log('🚀 ~ file: index.js ~ line 10 ~ colorTeal', colorTeal);
// const x = props.x;
// const y = props.y;
const setup = (p5, canvasParentRef) => {
p5.createCanvas(window.innerWidth, window.innerHeight).parent(
canvasParentRef
);
};
const draw = (p5) => {
windowResized(p5)
p5.background('#319795');
p5.ellipse(100, 100, 70, 70);
// x++;
};
const windowResized = (p5) => {
p5.resizeCanvas(window.innerWidth / 2, window.innerHeight / 2);
};
// Will only render on client-side
return <Sketch setup={setup} draw={draw}/>;
}
from react-p5.
@jamesgrubb @thisSource I'm gonna close this issue because I tested and windowResized events works perfectly....
@jamesgrubb try to put there a console log and resize the screen and you'll see that it works.......
The only problem which I see in your code is that you are calling resizeCanvas
method without p5.
in front
from react-p5.
Related Issues (20)
- Is it possible to change the image displayed with React image upload? HOT 2
- Problem with texture img when changing variable on click.
- How can I access to p5.Vector class? HOT 3
- Uncaught TypeError: particles[i].follow is not a function HOT 1
- Typing not available for the p5 declared in the window. HOT 1
- fft.waveform() doesn't return correct array
- issues with p5 sound library import HOT 3
- Cannot read properties of undefined (reading 'stringToGlyphs')
- Type errors appearing when implementing sketch in TS HOT 1
- Multiple instances of react-p5 don't seem to work HOT 2
- `noCanvas()` doesn't seem to work HOT 2
- windowWidth not defined HOT 2
- elements render twice requiring strict mode to be removed HOT 2
- stop sound if user navigates to another tab. HOT 1
- `window is not defined` even with the dynamic import on Next.js HOT 1
- Failed to load image in preload function HOT 1
- Can we update package.json to have the latest and greatest p5.js version? HOT 1
- Renderer for canvas? HOT 1
- Passing additional arguments to functions draw() and setup() HOT 1
- :boom: BUG: deconstruct not works ! HOT 1
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 react-p5.