KineticJS: Как повысить качество изображения SVG при уменьшении масштаба?

Я протестировал KineticJS 5.10 с изображением SVG:

var stage = new Kinetic.Stage({
    container: 'container',
    width: 400,
    height: 400
});
var layer = new Kinetic.Layer();
stage.add(layer);

var img=new Image();
img.onload = function () {
    var image = new Kinetic.Image({
        image: img,
        width: 100,
        height: 100,
    });
    layer.add(image);
    layer.draw();

}
img.crossOrigin="anonymous";
img.src = "https://dl.dropboxusercontent.com/u/139992952/stackru/rocket.svg";

После этого я уменьшаю изображение (сохраняя соотношение сторон):

image.scale({
 x: 30,
y: 30
});
layer.draw();

После этого я экспортировал сцену в формате JPEG с качеством 1.0:

stage.toDataURL({
            mimeType: "image/jpeg",
            quality: 1.0,
            callback: function(dataUrl) {
                // save image dataUrl to file
            }
        });

Оказывается, что качество изображения SVG очень плохо, только если вы уменьшите его. При увеличении размера качество не меняется.

Как повысить качество, уменьшив изображение SVG с помощью KineticJS?

Редактировать: вот пример, который я сделал: http://jsfiddle.net/confile/p6Eey/ Края очень хрустящие и не острые.

0 ответов

Другие вопросы по тегам