getTotalLength в строковом элементе (svg) в Inte rnet Explorer / Edge

Question

Метод

getTotalLength не работает в Inte rnet Explorer или Edge. Это дает следующую ошибку:

Объект не поддерживает свойство или метод getTotalLength

То же самое будет работать правильно в Firefox / Chrome. В этих браузерах общая длина строки соответствует ожидаемой.

MDN не говорит о поддержке inte rnet проводника для getTotalLength (ставится вопросительный знак)

Может ли кто-нибудь помочь мне определить лучшую альтернативу.

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

Answer 1

Вы можете проверить совместимость браузера с Могу ли я использовать

Вы можете легко сделать это, используя простой javascript

// get line element by using any getElement method
var line = document.getElementById("line-1");

//calculate distance between edge points by using following formula 
var len = dist(line.x1.baseVal.value, line.x2.baseVal.value,
               line.y1.baseVal.value, line.y2.baseVal.value);

function dist(x1, x2, y1, y2){
    return Math.sqrt( (x2-=x1)*x2 + (y2-=y1)*y2 );
}