7

私が取り組んでいるサイトには、何らかの理由で SVG 画像マーカーが IE 11 に表示されないという問題があります。

私は2セットのマーカーを持っています:

  • デフォルトのズームアウトには、郊外の PNG マーカーがあります
  • ズームインすると、アドレス固有の番号付きの SVG のものがあります

SVG をサポートしていない古いブラウザーのフォールバックを使用します (modernizr でテストしています)。IE 11 用の古い Google チャート マーカーを使用して機能させています (ユーザー エージェント文字列をテストして ID を確認しています)。

誰かが次のことについてアイデアを持っているかどうか知りたい:

  • 原因

  • IE11 エッジ モードで問題が発生したかどうか (ドキュメント モードを 10 に切り替えて動作させます)

  • またはGoogleで失敗しているもの。

サイトは次のとおりです。

http://artstrail.org.au/arts-trail.php

IE 11 でユーザー エージェント文字列を変更し、Edge ドキュメント モードのままにすると、失敗することがわかります。

4

4 に答える 4

6

現時点では、Google マップはマーカーに SVG 画像を使用することを実際にはサポートしていないようです。SVG マーカー画像が実際に機能することがわかっているため、この事実は見落としがちです。クロームとオペラ。

ただし、Google Maps API (v3) では、マップ マーカーにベクター パスを表示するためのSymbolオブジェクトが特別に提供されています。ベクトル画像をSVG パス表記で指定すると、IE などのブラウザで動作することがわかりました。

例 (Google マップのドキュメント、こちらから):

var goldStar = {
  path: 'M 125,5 155,90 245,90 175,145 200,230 125,180 50,230 75,145 5,90 95,90 z',
  fillColor: 'yellow',
  fillOpacity: 0.8,
  scale: 1,
  strokeColor: 'gold',
  strokeWeight: 14
};

var marker = new google.maps.Marker({
  position: map.getCenter(),
  icon: goldStar,
  map: map
});

（この回答もありがとう）

于 2014-10-28T12:24:38.637 に答える
-1

SVG が下位の IE バージョンでサポートされている場合は、メタを追加して IE10/IE9 をエミュレートします。

ie) IE-10 の場合<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10">

于 2015-10-21T10:44:01.457 に答える
-1

IE の実装は、次の点で SVG 標準から逸脱しています。

マーカー要素のプロパティは、マーカー要素の祖先からではなく、参照ポイントで継承します。

参考文献

MS-SVG: 「マーカー」要素

于 2014-02-28T23:34:15.060 に答える