Jak wykryć obsługę VML lub SVG w przeglądarce
Piszę trochę javascript i muszę wybrać pomiędzy SVG lub VML (albo oba, albo coś innego, to dziwny świat). Chociaż wiem, że na razie tylko IE obsługuje VML, wolałbym raczej wykrywać funkcjonalność niż platformę.
SVG wydaje się mieć kilka właściwości, które można wybrać: window.Na przykład SVGAngle.
Czy to najlepszy sposób na sprawdzenie obsługi SVG?
Czy jest jakiś odpowiednik dla VML?
Niestety-w Firefoksie mogę całkiem szczęśliwie wykonaj wszystkie renderowanie w VML bez błędu - po prostu nic się nie dzieje na ekranie. To dość trudne do wykrycia tej sytuacji ze skryptu.
8 answers
Do wykrywania VML, oto co Google maps robi (szukaj "function Xd"):
function supportsVml() {
if (typeof supportsVml.supported == "undefined") {
var a = document.body.appendChild(document.createElement('div'));
a.innerHTML = '<v:shape id="vml_flag1" adj="1" />';
var b = a.firstChild;
b.style.behavior = "url(#default#VML)";
supportsVml.supported = b ? typeof b.adj == "object": true;
a.parentNode.removeChild(a);
}
return supportsVml.supported
}
Rozumiem, co masz na myśli o FF: pozwala na tworzenie dowolnych elementów, w tym elementów vml (<v:shape>). Wygląda na to, że jest to test atrybutu adjacency , który może określić, czy utworzony element jest rzeczywiście interpretowany jako obiekt vml.
Do wykrywania SVG działa to ładnie:
function supportsSvg() {
return document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Shape", "1.0")
}
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2009-03-17 22:21:48
Proponuję jedną poprawkę do odpowiedzi crescentfresh-użyj
document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1")
Zamiast
document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Shape", "1.0")
Aby wykryć SVG. WebKit jest obecnie bardzo wybredny w kwestii funkcji raportowania i zwraca false dla feature#Shape pomimo stosunkowo solidnej obsługi SVG. feature#BasicStructure alternatywa jest sugerowana w komentarzach do https://bugs.webkit.org/show_bug.cgi?id=17400 i daje mi odpowiedzi, których oczekiwałem na Firefox/Opera / Safari / Chrome (prawda) i IE (fałsz).
Zauważ, że podejście implementation.hasFeature zignoruje wsparcie za pomocą wtyczek, więc jeśli chcesz sprawdzić np. wtyczkę Adobe SVG Viewer dla IE, musisz to zrobić osobno. Wyobrażam sobie, że to samo dotyczy wtyczki RENESIS, ale nie sprawdziłem.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-12-16 18:32:26
Sprawdzanie SVG nie działało u mnie w Chrome, więc przyjrzałem się, co robi Biblioteka Modernizera w sprawdzaniu ( https://github.com/Modernizr/Modernizr/blob/master/modernizr.js).
Na podstawie ich kodu, to działa dla mnie:
function supportsSVG() {
return !!document.createElementNS && !!document.createElementNS('http://www.w3.org/2000/svg', "svg").createSVGRect;
}
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-03-30 23:17:47
Możesz to pominąć i użyć biblioteki JS, która pozwoli Ci na rysowanie wektorowe między przeglądarkami, jeśli taka jest intencja. Biblioteka zajmie się tym, wysyłając do SVG, jeśli jest obsługiwana, lub do canvas, VML, flash, silverlight, itp., Jeśli nie, w zależności od tego, co jest dostępne.
Przykładami bibliotek, które to zrobią są, w żadnej szczególnej kolejności:
- Dojo.gfx (http://docs.dojocampus.org/dojox/gfx/)
- Raphaël ( http://raphaeljs.com/)
- SVGWeb (http://code.google.com/p/svgweb/)
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-02-16 02:24:00
var svgSupport = (window.SVGSVGElement) ? true : false;
Działa, jeśli założysz, że przeglądarki inne niż SVG są IE5. 5 lub lepsze i mogą obsługiwać VML. Testowane na IE6, Firefox 8, Chrome 14.0.
Raphael jest bardzo fajny, ale nie popiera koncepcji grup, które mogą być ograniczone w zależności od tego, co robisz. Dmitry pewnie mnie za to ogłosi.Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2011-11-18 06:22:10
You may want to check out http://www.modernizr.com/docs/#features-misc ponieważ zawiera wsparcie dla rzeczywistego wykrywania możliwości SVG w przeciwieństwie do sniffingu user-agent, który może być łatwo uszkodzony.
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-01-26 20:45:57
SVG-check nie działa w Chrome, ponieważ określa wersję 1.0. To powinno działać lepiej:
document.implementation.hasFeature("http://www.w3.org/TR/SVG11/feature#Shape", "1.1")
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2013-06-13 16:26:12
Z drugiej strony... Kiedy chcesz wiedzieć zanim podasz stronę: Scrapuj tę stronę: http://caniuse.com/#cats=SVG&statuses=rec&nodetails=1 Dla przychodzącej przeglądarki / agenta użytkownika. Zastrzeżenie: Jeszcze tego nie wdrożyłem. Jak mam nadzieję caniuse.com opublikuje api do pracy z.
MarkT
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-01-09 06:36:42