2012-02-19 3 views
2

Я работаю со следующими linearGradient элемента:SVG выражения для LinearGradient координаты

<linearGradient 
    inkscape:collect="always" 
    xlink:href="#linearGradient8704" 
    id="linearGradient8774" 
    gradientUnits="userSpaceOnUse" 
    x1="45%" 
    y1="45%" 
    x2="55%" 
    y2="55%" /> 

Можно ли каким-то образом использовать основные выражения в X/Y координат? Я хотел бы быть в состоянии сделать что-то вроде этого:

x1="50% - 20px", 
y1="50% - 20px", 
+1

Возможно, вы захотите обновить вопрос, чтобы уточнить, что вам нужно использовать это в фоновом изображении CSS, поскольку это исключает использование javascript внутри svg. И ваш целевой браузер - Opera на Nintendo Wii. –

ответ

1

Есть ли конкретная причина, почему вы должны сделать это таким образом? Не умалять ваш оригинальный вопрос, но кодер внутри меня кричит, что использование выражений с разными единицами неверно. Можно ли преобразовать одно из значений в другие единицы, используя javascript? Что-то вроде:

var new_x1 = (window.innerWidth/2) + 20; 
document.getElementById('linearGradient8774').setAttribute('x1', new_x1 + 'px'); 
+0

Я пытаюсь улучшить приблизительный эффект вставки. Вы можете увидеть мой оригинальный вопрос по адресу http://graphicdesign.stackexchange.com/questions/6028/svg-downward-inner-bevel. Я делаю графику для веб-интерфейса для Nintendo Wii, который не поддерживает CSS3, но поддерживает изображения SVG для элементов DIV. Мне понадобился ящик с динамическим размером, но фиксированный радиус границы (сделанный) и градиент границы, который соответствовал этим углам фиксированного размера, чтобы эффект выглядел правильно. Я ничего не знаю о SVG ... могу ли я использовать JS в самом документе SVG? Или работает JS на моей странице с SVG? – Brad

+0

Вы можете на самом деле сделать то и другое. Если у вас есть страница, управляющая svg, я бы рекомендовал добавить к ней некоторые сценарии, в противном случае вы можете вставлять теги сценариев (или внешние файлы) в svg. (См. Здесь, рядом с: http://pilat.free.fr/english/routines/js_dom.htm) – Jlange

1

Это может стать возможным использовать известково() выражения (как это определено в CSS) в представлении атрибутов в будущем, но это не часть любого SVG спецификации, и AFAIK нет реализации в момент, который поддерживает это.

Возможно, вы сможете получить эту работу, если вы используете встроенные svg и javascript для расчета необходимых вам значений, а затем поместите svgs, где они вам нужны, с помощью CSS.