работа с SVG через object

[Johan]

делаю вывод подсказок на интерактивную карту, в js новичок, можете указать где ошибка, буду благодарен

<object data="map.svg" type="image/svg+xml" id="svgmap" width="100%" height="100%"></object>
	
<div class="map-tooltip"></div>

var svgobject = document.getElementById('svgmap');
var svgdom = svgobject.contentDocument;

var tooltip = document.querySelector('.map-tooltip');
var contents = {};

contents['dom-48-a'] = '<img src="img/1.jpg"><h1>тест</h1><p>тест</p>';
contents['dom-37-9'] = '<img src="img/1.jpg"><h1>тест 2</h1><p>тест 2</p>';

 


[].forEach.call(svgdom.querySelectorAll('.HI-map'), function(item) {

  item.addEventListener('click', function() {
    window.open(this.getAttribute('data-link'));
  });
  

  item.addEventListener('mouseenter', function() {
    tooltip.innerHTML = contents[item.getAttribute('data-tooltip')];
    tooltip.style.display = 'block';
  });
  
  item.addEventListener('mousemove', function(e) {


	
  tooltip.style.top =
      (e.pageY + tooltip.clientHeight + 10 < svgdom.body.clientHeight)
          ? (e.pageY + 10 + "px")
          : (svgdom.body.clientHeight + 5 - tooltip.clientHeight + "px");
	
  tooltip.style.left =
      (e.pageX + tooltip.clientWidth + 10 < svgdom.body.clientWidth)
          ? (e.pageX + 10 + "px")
          : (svgdom.body.clientWidth + 5 - tooltip.clientWidth + "px");
	
	

  });
  

  item.addEventListener('mouseleave', function(){
  	tooltip.style.display = 'none';
  });
});