Рафаэль-GWT: изображение заливки фигуры (Rect) появляется смещеннымКак решить это?

Question

Меня интересует поведение {Shape}.attr("fill","url({image.path})").

при применении заливочного изображения к фигуре:

public class AppMapCanvas extends Raphael {

    public AppMapCanvas(int width, int height) {
        super(width, height);
        this.hCenter = width / 2;
        this.vCenter = height / 2;
        ...
        Rect rect = this.new Rect(hCenter, vCenter, 144, 40, 4);
        rect.attr("fill", "url('../images/app-module-1-bg.png')"); // <--
        ...
    }
}

Фоновое изображение, кажется, чиркает по холсту за формой, таким образом, получается странное расположение (снимок иллюстрации прилагается - я отметилисходное изображение граничит красным).

Это, кажется, разрешается при наличии анимации вдоль пути (простого path.M(0,0) достаточно).

Как я могу правильно расположить заливочное изображение?

Answer 1

Правильный способ сделать это, насколько я понимаю, состоит в том, чтобы использовать декларацию шаблона SVG для указания части и положения изображения, которое вы хотите использовать. Затем вы использовали бы этот шаблон для заполнения прямоугольного элемента. К сожалению, библиотека Raphael javascript не поддерживает шаблоны ... поэтому нет прямого способа использовать изображение для заполнения прямоугольника.