SigmundAI Copilot allows you to build and debug experiments with help from artificial intelligence. Install the Sigmund extension (public beta) and try it out now!
画布功能
Canvas
类用于呈现视觉刺激。您通常可以通过Canvas()
工厂函数创建一个Canvas
对象。因为Canvas()
是一个函数,所以调用它时不需要使用new
。JavaScript Canvas
类模仿了相应的Python Canvas
类。
__样式关键词__可以传递给所有接受styleArgs
的函数。样式关键词也可以设置为Canvas
对象的属性。有关样式关键词的概述,请参阅Python Canvas
文档。
重要提示: JavaScript不支持命名参数(或称:关键字)。因此,参数通过带有命名属性和默认值的Object
传递。就像这样:
var myCanvas = Canvas()
// (正确)将参数作为对象传递...
myCanvas.fixdot({color: 'red'})
// (错误)...而不是作为命名参数
// myCanvas.fixdot(color='red')
myCanvas.show()
Canvas.arrow(obj)
绘制一个箭头。箭头是由7个顶点组成的多边形,箭头指向(ex,ey)。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.sx | Number |
0 |
obj.sy | Number |
0 |
obj.ex | Number |
50 |
obj.ey | Number |
0 |
obj.body_length | Number |
0.8 |
obj.body_width | Number |
0.5 |
obj.head_width | Number |
30 |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
var w = vars.width / 2
var h = vars.height / 2
// 重要:参数作为一个对象传递
myCanvas.arrow({sx: 0, sy: 0, w: w, h: h, head_width:100, body_length:0.5})
Canvas.clear([styleArgs])
以当前背景颜色清除画布。注意,通常使用不同的画布为每个实验 显示比使用单个画布并反复清除和重绘 这是更快的。
参数 | 类型 | 默认值 |
---|---|---|
[styleArgs] | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.fixdot({color: 'green'})
myCanvas.show()
// 做某事
myCanvas.clear()
myCanvas.fixdot({color: 'red'})
myCanvas.show()
Canvas.circle(obj)
绘制一个圆。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.x | Number |
0 |
obj.y | Number |
0 |
obj.r | Number |
50 |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.circle({x: 100, y: 100, r: 50, fill: true, color:'red'})
Canvas.ellipse(obj)
绘制一个椭圆。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.x | Number |
-50 |
obj.y | Number |
-25 |
obj.w | Number |
100 |
obj.h | Number |
50 |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.ellipse({x: -10, y: -10, w: 20, h: 20, fill:true})
Canvas.fixdot(obj)
绘制一个固定点。默认样式为中等打开。
- 'large-filled' 是一个半径为 16px 的实心圆。
- 'medium-filled' 是一个半径为 8px 的实心圆。
- 'small-filled' 是一个半径为 4px 的实心圆。
- 'large-open' 是一个半径为 16px,中心区域为 2px 空隙的实心圆。
- 'medium-open' 是一个半径为 8px,中心区域为 2px 空隙的实心圆。
- 'small-open' 是一个半径为 4px,中心区域为 2px 空隙的实心圆。
- 'large-cross' 是一个 16px 的十字形。
- 'medium-cross' 是一个 8px 的十字形。
- 'small-cross' 是一个 4px 的十字形。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.x | Number |
0 |
obj.y | Number |
0 |
obj.style | String |
'default' |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.fixdot()
Canvas.gabor(obj)
绘制一个 gabor 斑块。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.x | Number |
0 |
obj.y | Number |
0 |
obj.orient | Number |
0 |
obj.freq | Number |
.1 |
obj.env | String |
'gaussian' |
obj.size | Number |
96 |
obj.stdev | Number |
12 |
obj.phase | Number |
0 |
obj.col1 | String |
'white' |
obj.col2 | String |
'black' |
obj.bgmode | String |
'avg' |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.gabor({x: 100, y: 100, orient: 45, freq: .05})
Canvas.image(obj)
从文件池的文件中绘制图像。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.fname | String |
|
obj.center | Boolean |
true |
obj.x | Number |
0 |
obj.y | Number |
0 |
obj.scale | Number |
1 |
obj.rotation | Number |
0 |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.image({fname: 'image_in_pool.png'})
Canvas.line(obj)
绘制直线。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.sx | Number |
0 |
obj.sy | Number |
0 |
obj.ex | Number |
50 |
obj.ey | Number |
0 |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
var ex = vars.width / 2
var ey = vars.height / 2
myCanvas.line({sx: 0, sy: 0, ex: ex, ey: ey})
Canvas.noise_patch(obj)
绘制一个具有包络的噪声补丁。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.x | Number |
0 |
obj.y | Number |
0 |
obj.env | String |
'gaussian' |
obj.size | Number |
96 |
obj.stdev | Number |
12 |
obj.col1 | String |
'white' |
obj.col2 | String |
'black' |
obj.bgmode | String |
'avg' |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.noise_patch({x: 100, y: 100, env: 'circular'})
Canvas.polygon(obj)
绘制由顶点列表定义的多边形。即由线连接的点构成的形状。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.vertices | Array.<Array.<Number>> |
|
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
var n1 = [0,0]
var n2 = [100, 100]
var n3 = [0, 100]
myCanvas.polygon({vertices: [n1, n2, n3]})
Canvas.rect(obj)
绘制矩形。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.x | Number |
-50 |
obj.y | Number |
-25 |
obj.w | Number |
100 |
obj.h | Number |
50 |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.rect({x: -10, y: -10, w: 20, h: 20, fill:true})
Canvas.show() ⇒ Number
显示或"翻转"屏幕上的画布。
Canvas.text(obj)
绘制文本。
参数 | 类型 | 默认值 |
---|---|---|
obj | Object |
|
obj.text | String |
|
obj.center | Boolean |
true |
obj.x | Number |
0 |
obj.y | Number |
0 |
..obj.styleArgs | Object |
{} |
示例
var myCanvas = Canvas()
myCanvas.text({text: 'Some text'})