You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
... I'm sure I can do what with vanilla p5.js if I put in some effort (instance mode with a bit of extra work would probably do it), but wouldn't it be amazing if we could just write something like the following inline into an HTML page?
The canvas-only, widgetWidth and widgetHeight names are just placeholder ideas of course. I suppose the tricky parts would be calculating the size of these variables. Also, ideally there would be an implicit resizing event for the canvas if the window size changes, similar to windowResized for plain p5.js.
(if there already is a simple way to do this with p5 that I'm not aware of, please tell me!)
The text was updated successfully, but these errors were encountered:
<scripttype="text/p5"data-p5-version="1.0.0"data-preview-width="400"data-height="480">
function setup() {createCanvas(windowWidth,windowHeight);}
function draw() {background(220);circle(200,200,300);}</script>
Note that you need to add 80 to the data-height to get the desired windowHeight in the preview. So the above example uses data-height="480" to create a canvas that's 400 pixels wide.
I was wondering if there was a way to make the widget work similar to the visualisations in this article by Mike Bostock about visualising algorithms:
https://bost.ocks.org/mike/algorithms/
... I'm sure I can do what with vanilla p5.js if I put in some effort (instance mode with a bit of extra work would probably do it), but wouldn't it be amazing if we could just write something like the following inline into an HTML page?
or alternatively:
The
canvas-only
,widgetWidth
andwidgetHeight
names are just placeholder ideas of course. I suppose the tricky parts would be calculating the size of these variables. Also, ideally there would be an implicit resizing event for the canvas if the window size changes, similar to windowResized for plain p5.js.(if there already is a simple way to do this with p5 that I'm not aware of, please tell me!)
The text was updated successfully, but these errors were encountered: