不知道如何在我的代码中将光栅应用于每个行星

Question

我正在尝试按照 paper.js 网站上的基本示例在我的 canvas 上绘制行星，但是当我想在一个 for 循环将 "texture" 应用到它们中的每一个，只有一个行星获得纹理。

我已经在网上尝试了几个解决方案，但其中 none 使我能够做出我正在寻找的东西。您会注意到，在我的代码中，我同时拥有行星 (Points) 和恒星 (Stars)。纹理是一个基本的100*100正方形图像。

        var url = '../IMG/planettexture.png';
        var raster = new Raster(url);

        var count = 150;
        var x = window.innerWidth;
        var y = window.innerHeight;

        for (i=0;i<count;i++){

            var xrandom = randomCoordinates(x);
            var yrandom = randomCoordinates(y);

            var center = new Point(xrandom,yrandom);

            var points = 12;

            var radius1 = randomCoordinates(1);
            var radius2 = randomCoordinates(5);
            var path = new Path.Star(center, points, radius1, radius2);
            path.fillColor = 'white';

            raster.position = new Point(xrandom,yrandom);
            path.clipMask = true;
        }

        var path = new Path.Circle({
            center: [0, 0],
            radius: 10,
            fillColor: 'white',
            strokeColor: 'black'
        });

        var symbol = new Symbol(path);

        for (var i = 0; i < count; i++) {
            var center = Point.random() * view.size;
            var placedSymbol = symbol.place(center);
            placedSymbol.scale(i / count);
        }

        function randomCoordinates(number){
            return Math.random()*number;
        }

        function onFrame(event) {

        for (var i = 0; i < 450; i++) {
            var item = project.activeLayer.children[i];

            item.position.x += item.bounds.width / 20;

            if (item.bounds.left > view.size.width) {
               item.position.x = -item.bounds.width;
            }
        }
    }

你需要 Paper.js 到运行这个。使用此代码，只有一颗星是 "textured"，其余的在我的屏幕上不可见。您知道问题出在哪里吗？

Answer 1

您不需要在 for 循环中克隆栅格吗？

var clonedRaster = raster.clone();
clonedRaster.position = new Point(xrandom,yrandom);

这是一个工作示例：https://codepen.io/JulienLemaitre/pen/PMmBNJ

不知道如何在我的代码中将光栅应用于每个行星

Don't know how to apply raster to every planet in my code

javascript

paperjs