2020-08-30绘制小汽车

最终效果

代码

 //绘制背景
noStroke();
fill(180, 199, 231);
rect(0, 0, 800, 500);
fill(191, 144, 0);
rect(0, 500, 800, 600);

背景

//绘制背景
    noStroke();
    fill(180, 199, 231);
    rect(0, 0, 800, 500);
    fill(191, 144, 0);
    rect(0, 500, 800, 600);
    // 绘制太阳
    fill("yellow");
    circle(750, 50, 150);
    stroke("yellow");
    strokeWeight(6);
    line(480, 60, 561, 47);
    line(548, 224, 602, 172);
    line(740, 304, 747, 236);

太阳

    noStroke();
    fill(180, 199, 231);
    rect(0, 0, 800, 500);
    fill(191, 144, 0);
    rect(0, 500, 800, 600);
    // 绘制太阳
    fill("yellow");
    circle(750, 50, 150);
    stroke("yellow");
    strokeWeight(6);
    line(480, 60, 561, 47);
    line(548, 224, 602, 172);
    line(740, 304, 747, 236);
    // 绘制小汽车
    stroke("black");
    strokeWeight(1);
    fill(112, 173, 71);
    rect(175, 340, 223, 54);
    rect(108, 394, 362, 74);
    fill(132, 60, 12);
    circle(168, 468, 32);
    circle(408, 468, 32);

最终效果

p5.js介绍

p5.js

p5.js is a JavaScript library for creative coding, with a focus on making coding accessible and inclusive for artists, designers, educators, beginners, and anyone else! p5.js is free and open-source because we believe software, and the tools to learn it, should be accessible to everyone.

Using the metaphor of a sketch, p5.js has a full set of drawing functionality. However, you’re not limited to your drawing canvas. You can think of your whole browser page as your sketch, including HTML5 objects for text, input, video, webcam, and sound.

processing

p5.js的前身是processing。

processing官网截图

Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology. There are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning and prototyping.

• » Free to download and open source
• » Interactive programs with 2D, 3D, PDF, or SVG output
• » OpenGL integration for accelerated 2D and 3D
• » For GNU/Linux, Mac OS X, Windows, Android, and ARM
• » Over 100 libraries extend the core software
• » Well documented, with many books available