p5.js | createColorPicker()函数

p5.js 中的createColorPicker()函数用于在 DOM（文档对象模型）中创建一个颜色选择器元素，用于获取输入颜色。 .color() 方法用于获取当前选择的颜色。此函数包括 p5.dom 库。在 head 部分添加以下语法。

句法：

createColorPicker( value )

参数：此函数接受单个参数值，该值包含颜色选择器的默认颜色。

示例：此示例使用颜色选择器对象来设置背景颜色。

// Create a variable for color-picker object
var color_picker;
  
function setup() {
    
    // Create a canvas
    createCanvas(400,400);
      
    // Create a color-picker object 
    color_picker = createColorPicker("green");
}
  
function draw() {
      
    // Set the background-color as
    // chosen by the color-picker
    background(color_picker.color());
}                    

输出：

• 在选择颜色之前：
  
• 从颜色选择器中选择颜色：
  
• 选择颜色后：
  

参考： https://p5js.org/reference/#/p5/createColorPicker