EaselJS, Canvas, растровое изображение низкого качества и точка регистрации не работает

Я только начал использовать EaselJS для проекта, над которым я работаю, и я немного застрял в классе Bitmap. Что я делаю, так это добавляю изображение размером 3000 x 4000 на холст / сцену и позволяю пользователю масштабировать и вращать его. В основном я использую следующую функцию:

@width = 3000
@height = 4000
@scale = 0.2

@bitmap.setTransform( 0, 0, @scale, @scale, 200, 0, 0, @width*@scale/2, @height*@scale/2 )

Это все работает кроме точки регистрации. Число, данное функции, составляет половину ширины/высоты изображения, так что должно быть хорошо. Но вращение все равно не от центра..

Также я ищу способ повысить качество этого растрового изображения или сцены. Когда растровое изображение масштабируется до 0,2, изображение вообще не видно, просто куча больших блоков/пикселей..

Надеюсь, кто-то может помочь мне здесь,

заранее спасибо


javascript canvas coffeescript bitmap easeljs
person Tim Baas    schedule 18.11.2012    source источник

Ответы (1)


arrow_upward
10
arrow_downward

Глупая ошибка, мой холст был увеличен, поэтому качество было низким, даже если изображение не было масштабировано.

Ширина и высота атрибуты определяют разрешение холста.

Ширина и высота стиля css определяют размер холста.

Для всех, у кого проблемы с качеством, можно передискретизировать холст:

<style>
  canvas {
    width:200px;
    height:100px;
  }
</style>

<canvas width='400' height='200' />

Источник: http://blog.headspin.com/?p=464

person Tim Baas    schedule 19.11.2012