0

我正在使用 kineticjs 正多边形（在本例中为六边形），并使用 setFillPatternImage 填充图像。这是有效的。我正在创建一个动态实现，因此我需要根据多边形的当前大小来缩放源图像。这涉及计算 setFillPatternOffset 和 setFillPatternScale，因为正多边形的尺寸是相对于中心的。关于填充图像的参考点，我找不到明确的文档，也没有缩放因子是否应该使用半径作为宽度和高度比的代理。以下代码会导致多边形上的图像错位。任何人都知道fillPatternImage的对齐规则是什么？

imageObj.onload = function() {
    var whex = hexagon.getRadius() * 2;
    var xratio = whex / imageObj.width;  
    var yratio = whex / imageObj.height;

    hexagon.setFillPatternImage(imageObj);
    hexagon.setFillPatternOffset(-whex/2,-whex/2);
    hexagon.setFillPatternScale( [ xratio, yratio ] );
};

谢谢！

4

1 回答 1

1

看来我是多虑了。在设置偏移量时，kineticjs 不会使用目标多边形的宽度，而是为您处理该偏移量的缩放。因此，您只需设置偏移量： 

hexagon.setFillPatternOffset(-imageObj.width/2, -imageObj.height/2);
于 2013-04-18T11:30:30.697 回答