Styles Functions 函数 - caleb531/jcanvas-docs GitHub Wiki

Functions 函数

jCanvas allows you to use a user-defined function as the value for any fill or stroke style. The function accepts one argument: the parameters object passed into the method (or the layer object if the drawing is a layer).
jCanvas允许你使用用户定义的函数,作为任意填充或描边样式的值,函数接收一个参数:传入方法中的参数对象(或者如果在绘制层时,就是层对象)。
Functions as fill/stroke styles can be useful for dynamic computation of those styles.
作为填充或描边样式的函数,对于动态计算样式来说很有用。

// The circle changes color as you drag it 圆会在你拖拽它时变色
$('canvas').drawArc({
  layer: true,
  draggable: true,
  x: 50, y: 50,
  radius: 30,
  fillStyle: function(layer) {
    var value = Math.round(layer.x / this.width * 360);
    value = Math.min(value, 360);
    return 'hsl(' + value + ', 50%, 50%)';
  }
});

Notes 注意

The return value of the given function will be used as the resulting fill/stroke style.
给定函数的返回值,会被用作最终的填充/描边样式。