Рафаэль текст и сафари - PullRequest
Новая
       29

Рафаэль текст и сафари

3 голосов
/ 04 февраля 2012

В последнее время я использовал Raphael 2.0.1 для проекта, и я просто проводил несколько кросс-браузерных проверок и увидел, что текст (и только текст…) не отображается правильно в Safari.Похоже, происходит то, что 'dy устанавливается на то же значение, что и значение' s 'y'.

Вот выдержка из отрисованного html, характерного для того, о чем я говорю: 

<text style="font: normal normal normal 12px/normal 'Helvetica Neue'; text-anchor: start; cursor: pointer; opacity: 0.7; " x="96" y="15" text-anchor="start" font="12px &quot;Helvetica Neue&quot;" stroke="none" fill="#17d6c6" opacity="0.7">
<tspan dy="15">U.S Population - Blood</tspan>
<tspan dy="10.799999999999999" x="96">Type Breakdown</tspan>
</text>

А вот мой js для рассматриваемого текста: 

var type_text = lab_culture_type.text(96, 15, 'U.S Population - Blood\nType Breakdown');
    type_text.attr({'fill':'#17D6C6', 'font':'12px "Helvetica Neue"', 'text-anchor':'start','cursor':'pointer'});

Как я уже сказал, значения y и cy связаны только в Safari.У меня есть много текста, отображаемого Рафаэлем, так что установка имен классов для каждого из них является чем-то вроде вопроса (ну, я пытаюсь избежать этого, так как он кажется мне небрежным).Я пытался нацелиться на dy, но, похоже, не могу его получить.Кстати, я использую Raphael вместе с jQuery.

Используя FF: 9.0.1 и Safari: 5.1.2 на OS X.

Заранее спасибо за помощь!

1 Ответ

3 голосов
/ 07 февраля 2012

Попробуй это. Прежде чем звонить Рафаилу, убедитесь, что контейнер вставлен. 

var container = $('<div></div>'),
    r;

// Insert
$('body').append(container);

r = Raphael($container[0], 800, 600);

// Add text etc, dy on tspan should be correct...

Если вы сделаете это иначе, атрибут typan dy будет испорчен (как вы заметили). Я обнаружил, что это произошло во всех браузерах webkit.

Надеюсь, это поможет.

...