0

KinetickJS を使用して画面に画像を描画しています。ステージにレイヤーがあり、base64 形式で 1000 枚の画像を受け取ります。まずはキネティックで描いてみます

例1、正常に動作しますが、1000枚の画像をドラッグしたり、レイヤーで何かを実行しようとすると、非常に遅くなりました。次の例を試します

var imageObj = new Image();
        imageObj.onload = function () {
            var image = new Kinetic.Image({
                x: imageInfo.LocationX,
                y: imageInfo.LocationY,
                image: imageObj,
                width: imageInfo.Width,
                height: imageInfo.Height,
                name: "Update"
            });

            layer.add(image);
            layer.draw();

        };
        imageObj.src = "data:image/jpeg;base64," + imageInfo.Image;

例 2、ただしこの場合、更新ごとにキャンバスが点滅し始めました

var imageObj = new Image();


       imageObj.onload = function () {

                 var canvas = layer.canvas;
                  var context = canvas.getContext('2d');
//                   context.globalCompositeOperation = "destination-over";
             context.drawImage(imageObj, imageInfo.LocationX, imageInfo.LocationY);


            };
        imageObj.src = "data:image/jpeg;base64," + imageInfo.Image;

それで、それをより速くしたり、点滅を無効にしたりする方法はありますか？

4

1 に答える 1

0

最新の KineticJS 4.3 では、ドラッグやその他の機能が大幅に高速化されています。これで問題が解決する可能性があります。

 http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.3.0.min.js
于 2013-01-11T17:18:24.753 に答える