Chrome не меняет размер изображения SVG - PullRequest
3 голосов
/ 10 ноября 2010

Я хотел бы прочитать в файле SVG, определить его ширину и высоту, чтобы масштабировать его. На данный момент мой код выглядит следующим образом:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <style type="text/css" media="all">@import "style/style.css";</style>
  <meta name="svg.render.forceflash" content="false" />
  <script src="svg.js" data-path="svgweb/src/"></script>
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js">   </script>
  <script type="text/javascript">
    $(window).load(function() {
      function loadContent(){
        /*  SVG  */
        var svg = document.getElementById('myimage')

        /*  Adapt size of SVG */
        try {
      SVGDoc = svg.contentDocument;
    } catch (Err) {
      SVGDoc = svg.getSVGDocument;
        }
        var root = SVGDoc.documentElement;
        if (root.attributes['width'] != null) {
        var width = root.attributes['width'].nodeValue;
        width = width.substring(0, width.length - 2);
        width = (width * 1.25);
        var height = root.attributes['height'].nodeValue;
        height = height.substring(0, height.length - 2);
        height = (height * 1.25);
        svg.width = width;
        svg.height = height;
      }
</script>
</head>
<body>
  <div id="map">
    <!--[if IE]>
    <object id="myimage" src="images/myimage.svg" classid="image/svg+xml">
    <![endif]-->
    <!--[if !IE]>-->
    <object id="myimage" data="images/myimage.svg" type="image/svg+xml">
    <!--<![endif]-->
    </object>
  </div>
</body>
</html>

Этот код отлично работает в Firefox (хотя можно очень быстро увидеть изменение размера). Тем не менее, инструмент разработчика в Chrome nags: Uncaught TypeError: Невозможно прочитать свойство 'documentElement' из неопределенного для строки "var root = SVGDoc.documentElement;". Кроме того, Chrome не изменяет размер изображения.

Я не могу найти рабочее решение для обоих браузеров.

1 Ответ

3 голосов
/ 10 ноября 2010

Во-первых, getSVGDocument () - это метод, а не свойство.Вам нужно позвонить это:

SVGDoc = svg.getSVGDocument();

Во-вторых, SVGDoc само должно быть где-то объявлено:

var SVGDoc;

В-третьих, Chrome такая же политика происхождения не нравится протокол file:.Вам придется обслуживать изображения SVG вместо чтения их из локальных файлов.

...