Как избежать использования текста в Рафаэле? - PullRequest
Новая
       22

Как избежать использования текста в Рафаэле?

1 голос
/ 16 декабря 2011

Недавно я много работал с текстовой функцией Raphael, и у меня возникло огромное количество проблем.

Мое приложение требует загрузки текста в перетаскиваемые, масштабируемые наборы Raphael.К сожалению, текст из 

var title = paper.text(0,0,"this is text");
...
mySet.push(title);
...
mySet.animate({scale: ".5 .5 0 0"},1000,function(){...})

не масштабирует текст вместе с набором.

Я попытался использовать несколько различных подходов для решения этой проблемы, включая paper.print (),и у меня не было ничего, кроме проблем.

Я думаю, что на этом этапе было бы гораздо разумнее динамически генерировать HTML5-холст для правильного отображения всего текста и информации, который мне нужен, а затем переместить холст визображение, которое можно вставить в мой проект Raphael.

Кто-нибудь знает какие-либо альтернативные решения или как я могу создать холст и вставить изображение этого холста в мой проект Raphael?

1 Ответ

3 голосов
/ 17 декабря 2011

Использование HTML5 отлично работает.

Я сделал следующее: 

var canvas = jQuery("<canvas width=300px height=400px />");
var context = canvas[0].getContext("2d");

context.font = "10pt Calibri ";
context.textAlign = "left";
context.textBaseline = "top";

context.fillText("this is text", xPos, yPos);

и затем, чтобы реализовать его в моем наборе Рафаэля, я сделал: 

var img = canvas[0].toDataURL("image/png"); //turns the canvas object into a png and returns the dynamic url 
var bb = mySet.getBBox();
mySet.push(
  paper.image(img,bb.x,bb.y,300,400)
)
...