Я использую внедренный SVG в XHTML и хочу создать анимацию из Javascript, но он не работает, как ожидалосьсоздание анимации из Javascript с помощью встроенного SVG в XHTML
Я моделирование бизнес-процессов с XPDL и подключить моделирование к SVG-графику, которую я анимацию использую javascript. Я делаю это в Firefox, а модель и графика встроены в XHTML. Теперь проблема в том, что я хочу использовать animateMotion-Tag для перемещения объекта по пути. Оба уже существуют, поэтому я попытался написать свое решение в SVG-файл, и это сработало нормально. Он выглядел так:
<animateMotion xlink:href="#id1" rotate="auto" dur="2s">
<mpath xlink:href="#id2">
</animateMotion>
Конечно, пространства имен установлены правильно, поэтому это работает так, как ожидалось. Я запускаю его вручную, поэтому времени начала не требуется. Теперь, мой подход делает то же самое в существующей смешанной XHTML/SVG-дом:
function moveAlongPath(elemId,pathId,rotate,duration)
{
var svgNs = "http://www.w3.org/2000/svg";
var xlinkNs = "http://www.w3.org/1999/xlink";
var motionElem = document.createElementNS(svgNs,"animateMotion");
motionElem.setAttributeNS(xlinkNs,"href","#" + elemId);
motionElem.setAttributeNS(svgNs,"rotate",rotate);
motionElem.setAttributeNS(svgNs,"dur",duration + "ms");
var pathRef = document.createElementNS(svgNs,"mpath");
pathRef.setAttributeNS(xlinkNs,"href","#" + pathId);
motionElem.appendChild(pathRef);
var animElem = svgRootNode.getElementById(elemId); // It is indeed the <svg>-Node
animElem.appendChild(motionElem);
// Setting x and y to 0 is important for the Element to be "on" the Path
animElem.setAttribute("x",0);
animElem.setAttribute("y",0);
motionElem.beginElement();
}
Когда я проверяю РОВ поджигатель, это, кажется, производит ту же структуру узла с теми же атрибутами, хотя HREF isnt префикс xlink :, но setAttributeNS должен это сделать, правильно? Проблема здесь в том, что я не могу запустить анимацию с beginElement(). Здесь ничего не происходит.
Я надеюсь, что там есть помощь, я действительно отчаялся прямо сейчас.
EDIT: Я нашел его наконец. Проблема исчезает, когда я использую
setAttributeNS(null,"attr",value)
вместо
setAttributeNS(svgNs,"attr",value)
исправить это, если я не прав, но это не мой первый подход как думали XML? То, что не должно быть имен без атрибутов? В любом случае - РЕШАЕМ!
Вы никогда не должны использовать пространство имен SVG для атрибутов. Вместо этого отправьте свой ответ в качестве ответа и примите его. –