Как правильно задать tooltip в SVG с помощью JS, если SVG добавляется через <object>
, и элементы SVG имеют только id
и не имеют <title>
?
<div class="box-body">
<center>
<object id="idImageSVG" class="svgClass" type="image/svg+xml" data="./img/exoModel.svg">
Your browser does not support SVG
</object>
</center>
</div>
$(window).load(function ()
{
g_SvgModel = document.getElementById("idImageSVG");
var svgDoc = g_SvgModel.contentDocument;
g_SvgDrive1 = svgDoc.getElementById("drive1");
}
function updateSysInfo() {
$.ajax({
url: '/api/dashboard/states',
type: 'GET',
success: function (res) {
if (res.err) {
setTimeout(updateSysInfo,1000);
} else {
if (g_SvgTooltipDrive1 != null)
{
var tooltip = document.createElementNS("http://www.w3.org/2000/svg",'title');
tooltip.innerHTML = 'текст тул-типа';
g_SvgTooltipDrive1.setAttribute('textContent', '11111');
}
setTimeout(updateSysInfo,1000);
}
},
error: function (xhr, ajaxOptions, thrownError) {
notifyError(thrownError);
}
});
}
Как то так:
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100">
<g>
<circle cx="20" cy="20" r="20"/>
<title>Его тул-тип</title>
</g>
</svg>
Положить title
в одну группу с элементом.
Если это надо делать через JS то создаёте title
програмно
let tooltip = document.createElementNS("http://www.w3.org/2000/svg",'title');
tooltip.innerHTML = 'текст тул-типа';
И потом добавляете в группу к элементу.
EDIT:
Если g_SvgDrive1
является группой то просто сделайте:
g_SvgDrive1.appendChild(tooltip);
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
Добрый день всем! Есть проблема, и никак не могу найти решения, тк
Доброго времениПри работе с сайтом через ftp иногда приходится чистить кэш что бы увидеть результат, чаще всего это требуется если добавил...
Обычно в литературе для доступа к элементу рекомендуют использовать documentgetElementById("id_")
Суть такаяПросто жму на кнопку "next", запускается цикл, цикл перебирает элементы