Użycie znacznika podstawowego na stronie zawierającej elementy znacznika SVG nie powoduje renderowania znacznika
Wystąpił problem podczas próby użycia elementów znacznika SVG w wizualizacji opartej na SVG. Dodaję moje zmiany do aplikacji internetowej, która zawiera tag podstawowy na każdej stronie, więc wszelkie odniesienia do plików CSS, plików javascript itp. Mogą być względne.
Mam poniżej przykładowy kod, który odtwarza problem. Istnieje element linii i zdefiniowany element znacznika. Do elementu znacznika odwołuje się linia w atrybucie „koniec znacznika”, poprzez uri i identyfikator znacznika. Bez znacznika podstawowego strzałka jest dobrze wyświetlana. Z tagiem podstawowym nie jest wyświetlany. Powodem jest to, że znacznik podstawowy zmienia sposób, w jaki przeglądarka rozwiązuje adresy URL ... nawet dla prostego adresu URL opartego na identyfikatorze określonego w atrybucie końca znacznika linii.
Czy jest jakiś sposób na obejście tego problemu bez konieczności usuwania tagu podstawowego?
Naprawdę nie mogę go usunąć, ponieważ korzystanie z niego jest mocno zakorzenione w produkcie, nad którym pracuję. Muszę obsługiwać Firefox, Chrome i IE9 + dla mojej aplikacji internetowej. Zarówno Firefox, jak i chrom powodują ten problem. IE działa poprawnie (tzn. Wyświetla się znacznik strzałki).
<html>
<head>
<base href=".">
<style>
.link { stroke: #999; stroke-opacity: .6; }
marker#arrow { fill: black; }
</style>
</head>
<body>
<svg width="100%" height="100%">
<defs>
<marker id="arrow" viewBox="0 -5 10 10" refX="0" refY="0" markerWidth="20" markerHeight="20" orient="auto">
<path d="M0,-5L10,0L0,5"></path>
</marker>
</defs>
<line x1="100" y1="100" x2="333" y2="333" marker-start="url(#arrow)" class="link"></line>
</svg>
</body>
</html>