Анимация дуги в Raphael JS колеблется в Chrome - PullRequest
Новая
       1

Анимация дуги в Raphael JS колеблется в Chrome

2 голосов
/ 20 февраля 2012

Я вижу раздражающее колебание в моей анимации, я удалил код, который содержит фактическую анимацию: 

var side = 400;
var paper = new Raphael($(this), 100, side);

paper.customAttributes.arc = function (xloc, yloc, value, total, R) {


                var alpha = 360 / total * value,
                    a = (90 - alpha) * Math.PI / 180,
                    x = xloc + R * Math.cos(a),
                    y = yloc - R * Math.sin(a),
                    path;
                if (total == value) {
                    path = [
                        ["M", xloc, yloc - R],
                        ["A", R, R, 0, 1, 1, xloc - 0.01, yloc - R]
                    ];
                } else {
                    path = [
                        ["M", xloc, yloc - R],
                        ["A", R, R, 0, +(alpha > 180), 1, x, y]
                    ];
                }
                return {
                    path: path
                };
            };

            var arcWidth = 180 - 120;
            var strokeRadius = (120 + arcWidth/2);

            var indicatorArc = paper.path().attr({
                "stroke": "#4B6384",
                "stroke-width": 100,
                arc: [side/2, side/2, 0, 100, strokeRadius]
            });

            indicatorArc.animate({
                arc: [side/2, side/2, 75, 100, strokeRadius]
            }, 1500, "<>", function(){
                // anim complete here
            });

Я поместил его в jsfiddle, чтобы вы могли убедиться в этом сами, пожалуйста, проверьтев Firefox и Chrome вы заметите, что в Chrome края существенно колеблются, могу ли я что-нибудь сделать, чтобы устранить это?

скрипка здесь: многократно запускается

1 Ответ

1 голос
/ 12 августа 2014

Итак, я знаю, что этому уже более двух лет, но если кто-то сталкивался с этой проблемой, это известная ошибка в механизме 2D-рисования Chrome.

https://code.google.com/p/skia/issues/detail?id=2769

...