SVG и JS - SVG не поддается динамическому изменению атрибутов элемента.

Думаю, все знают, что есть такой сервис как Gmaps. Думаю, что некоторые пользовали его API. Так вот, у них есть бага с SVG графикой при отрисовке геозон, которое, я понимаю, как исправить (написал рабочую формулу расчета). Ладно, дело не в этом. Сел я изучать SVG графику и принципы ее отрисовки. Вроде бы разобрался. Далее, я статически нарисовал кружок и с помощью JS-а пытаюсь поменять его атрибуты. Например: Отрывок кода круга Отрывок JS кода MyClass.prototype.test = function(v){ p = v.cx.animVal.value; return this.p = p+10; }; Если трэйсить вывод функции, то результат возвращается правильный (в нашем случае - 210). Но! Не выполняется конструкция: onClick="this.cx.animVal.value = o.test(this);" По итогу получаем ошибку: Modifications are not allowed for this document Что свидетельствует о том, что нельзя странице с помощью JS менять атрибут этого элемента. Вопрос: почему и как можно добиться динамического изменения атрибутов элемента без его полной перерисовки?

Ответ

Ура, вопрос можно считать закрытым. Для начала я покопал атрибутику элемента SVG, и нашел такой метод как setAttribute. Собственно param.setAttribute("r", this.r) // Добавил атрибут радиуса и указал его размер, который храниться в this.r Далее этот атрибут можно менять сколько угодно раз без особых усилий :) Спаcибо мне :)