paperJS中不能直接使用lch或者lab颜色,不够可以调用tostring方法将其转换为对应的rgb颜色供给paperJS使用,下面是程序中的一个函数:
this.addContour = function( contour, contourColor, opacity=1.){
//this._ctx.clearRect(0,0,this._canvasWidth,this._canvasWidth)
console.log("addcontour")
var ctx = this._ctx
//ctx.beginPath()
console.log("contourColor",contourColor)
//ctx.strokeStyle = contourColor[1]
console.log("contourColor",contourColor)
var path = new paper.Path()
path.strokeColor = contourColor[1]
path.strokeWidth = 3
//var color = new paper.Color(contourColor[1])
var labColor = d3.lab(contourColor[1])
var lchColor = d3.hcl(labColor)
lchColor.opacity = opacity
//console.log("lchColor",lchColor)
//ctx.fillStyle = lchColor
//ctx.lineWidth = 3
var color = d3.rgb(lchColor).toString()
path.fillColor = lchColor.toString() //若此处没有toString(),画出来的是黑色,即颜色没有赋值给path.fillColor
for(var i=0; i < contour.length; ++i){
//console.log("i",i)
var dotCanvas = contour[i]
var coordinateArray = dotCanvas["coordinates"]
for(var j = 0; j < coordinateArray.length; ++j){
var array = coordinateArray[j]
if(array.length == 0) continue
for(var k = 0; k < array.length; ++k){
//console.log("array[k]",array[k])
coordinate = array[k]
for(var m = 0; m < coordinate.length; ++m){
var point = new paper.Point(coordinate[m][0], this._canvasHeight-coordinate[m][1])
if(m == 0){
path.moveTo(point)
//ctx.moveTo(coordinate[m][0], this._canvasHeight-coordinate[m][1])
}else{
//ctx.lineTo(coordinate[m][0], this._canvasWidth-coordinate[m][1])
path.lineTo(point)
}
}
}
}
}
path.closePath()
paper.view.draw()
//path.style = null
//ctx.closePath()
//ctx.fill()
//ctx.stroke()
}
paperJS中使用lab,lch等颜色
猜你喜欢
转载自blog.csdn.net/disasters/article/details/82805741
今日推荐
周排行