+ 2
Why does this code not show a rectangle ? Please help does it have anything to do with p5.js.
20 Answers
+ 6
It doesn't for me...
But it doesn't still show enough: add again some size to your createCanvas, or reduce the drawed rectangle ^^
+ 6
But better way to do complete html:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js"></script>
<script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/addons/p5.dom.js"></script>
</head>
<body>
</body>
</html>
+ 5
@Utkarsh:
It works, just with modifications I indicate previously ;)
+ 5
@visph It isn't working in my device with those changes also , but by adding the links i provided worked without any changes . I think dom library is important to create canvas 🤔
edited : i am friendly with p5 , background() will work in setup() , but yeah the 10x10 canvas is really small the rect looked more like a dot (^^)
+ 4
@shedric I see two function declaration but no invocation. what do you expect?
+ 4
@Apel Mahmod:
They are called by p5.js library ^^
+ 4
I think your links are incomplete , you forgot to add the dom library of p5 , try using these
<script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js"></script>
<script language="javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/addons/p5.dom.js"></script>
and one more thing there's an e missing in (createCanvas) you wrote - (creatCanvas)
+ 3
check out this site:
https://p5js.org/get-started/
+ 3
I'm not user of p5.js, but with the link provided by @Ulisses Cruz, some tests and complementary searches, I can tell you have to do some changes to your code, to make it working:
- syntax error ( creatCanvas instead of createCanvas ) in function setup()change
- size of canvas too much little ( unit is pixels ^^ : 10x10 isn't enough )
- background() function seems to have effect only in draw() function, not in setup() ( strangely, fill() does )
- size of drawed rectangle null ( (2,2,2,2) draw a rectangle from dot 2,2 to dot... 2,2... so side size is zero :P )
function setup(){
createCanvas(100, 100);
}
function draw(){
background(255, 2, 2);
fill(255, 255, 255);
rect( 2, 2, 98, 98);
}
+ 3
Maybe a problem of support for not enough uptodate browsers/os :P
+ 3
You have just to copy/paste... and almost try it by yourself is the best way to improve your skills ;)
+ 3
You can copy: use the post menu ( right top corner of a post -- 3 vertical dots )
+ 1
Are you trying to use the canvas to draw a rectangle?
+ 1
Ok. I understand now that you are trying to use the p5.js module.
It is not working because you did not reference it in your html. Add this line in the head
of the html page:
<script src="//cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.8/p5.js"></script>
+ 1
this did not work either
https://code.sololearn.com/WL8Xtd7jEG1a/?ref=app
+ 1
can you make the same program correctly for me then send it to me
+ 1
i cant copy paste in this chat
+ 1
not javascript i meant html
+ 1
this code gives an error why?
https://code.sololearn.com/WL8Xtd7jEG1a/?ref=app
0
i suck at javascript