Highcharts 在 IE 中向 SVG 元素添加重复的 xmlns 属性

Question

我正在使用 Highcharts 在 PHP Web 应用程序中创建图表。问题是，在 IE 中，创建的 SVG 元素最终会出现重复的 xmlns 属性。在F12开发者工具，HTML选项卡中可以看到：

^{（点击查看大图）}

虽然图表在浏览器中显示得很好，但在尝试使用 Batik 将其转换为图像文件时会出现问题，该文件会抱怨重复属性。

我已经在 IE 9 和 10 中重现了这一点，并且还使用 highcharts.com 上的演示图表（上面的屏幕截图就是在此处拍摄的）来重现的。但 Firefox 不会出现这种情况。

如何防止属性重复？或者，删除它的最佳方法是什么（PHP 或 jQuery）？我尝试通过 Tidy 运行包含 SVG 的 HTML，但这最终会将

clipPath

等元素转换为小写，这会导致其自身的问题。

Answer 1

我们现在修复了该错误，请参阅链接代码：https://github.com/highslide-software/highcharts.com/issues/1978。虽然该元素是使用

createElementNS

创建的，但只有 IE9 和 IE10 实际上为其创建了可见属性。因此，解决方法是添加该属性（如果不存在）。

Answer 2

看起来像 http://code.highcharts.com/highcharts.js

中的错误

f=this.createElement("svg").attr({xmlns:sa,version:"1.1"})

似乎是错误的（对于 SVG）并且应该是

f=this.createElementNS(xmlns:sa, "svg").attr({version:"1.1"})

尽管这一更改可能会破坏 IE < 9 VML implementation. Perhaps you should report it to hightcharts 支持

Answer 3

<svg xmlns="http://www.w3.org/2000/svg" width="240" height="160" viewBox="0 0 240 160" fill="var(--color-white)" class="injected-svg SpotIllustration--sm" data-src="https://dashboard-cdn.rebrandly.com/styleguide-assets/spot-illustrations/ill-spot-cart-empty.svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<circle opacity="0.04" cx="84" cy="62" r="62" fill="#8355E1"></circle>
<circle opacity="0.06" cx="194" cy="64" r="24" fill="#8355E1"></circle>
<circle opacity="0.08" cx="112" cy="148" r="12" fill="#8355E1"></circle>
<path d="M71.7697 136.999C66.4116 136.999 62.0455 132.535 62.0455 126.999C62.0455 121.463 66.4116 116.998 71.7697 116.998C72.8513 116.998 73.891 117.18 74.8619 117.515V136.483C73.891 136.818 72.8513 136.999 71.7697 136.999Z" fill="#F0F1F1" stroke="#E8E9EA"></path>
<ellipse cx="73" cy="127" rx="9" ry="10" fill="#909398"></ellipse>
<path d="M107.14 121.525C101.782 121.525 97.4156 117.06 97.4156 111.525C97.4156 105.989 101.782 101.524 107.14 101.524C108.221 101.524 109.261 101.705 110.232 102.04V121.009C109.261 121.344 108.221 121.525 107.14 121.525Z" fill="#F0F1F1" stroke="#E8E9EA"></path>
<ellipse cx="109.627" cy="111.525" rx="7.73722" ry="9.94786" fill="#909398"></ellipse>
<path fill-rule="evenodd" clip-rule="evenodd" d="M161.627 108.342C162.477 103.341 162.574 97.7974 162.396 94.2405L167 90.5C167.191 94.3119 167.483 103.727 166.556 109.18C166.093 111.904 165.406 114.614 164.386 116.915C163.384 119.175 161.929 121.342 159.751 122.552C158.605 123.189 156.806 123.889 154.696 124.611C152.536 125.351 149.889 126.169 146.948 127.025C141.061 128.737 133.914 130.628 126.96 132.393C120.001 134.158 113.218 135.802 108.051 137.022C102.983 138.219 99.2796 139.055 98.6508 139.145C98.1918 139.211 97.6968 139.155 97.4735 139.13L97.4688 139.129C97.1402 139.092 96.745 139.034 96.3076 138.961C95.4278 138.815 94.2702 138.594 92.9171 138.32C90.2052 137.771 86.624 136.991 82.7318 136.119C74.9429 134.372 65.8538 132.242 59.8602 130.812C58.7394 130.545 57.9464 129.546 57.9402 128.394C57.9339 127.242 58.7159 126.235 59.8338 125.955C68.6727 123.745 82.0265 120.376 93.3615 117.449C99.0302 115.985 104.186 114.634 108.017 113.595C109.935 113.075 111.508 112.637 112.643 112.303C113.212 112.135 113.654 112 113.967 111.896C114.147 111.837 114.243 111.801 114.282 111.787C115.482 111.072 115.969 110.199 115.969 109.037H120.969C120.969 112.268 119.271 114.696 116.67 116.182C116.312 116.387 115.82 116.55 115.536 116.644C115.146 116.772 114.644 116.926 114.053 117.1C112.867 117.448 111.255 117.898 109.326 118.421C105.465 119.468 100.286 120.825 94.6116 122.29C86.9942 124.257 78.4693 126.423 71.0119 128.303C75.213 129.282 79.7037 130.315 83.8257 131.24C87.7075 132.11 91.2487 132.881 93.9091 133.42C95.2422 133.689 96.3332 133.897 97.1272 134.029C97.5267 134.095 97.8247 134.138 98.0284 134.161C98.0512 134.163 98.0717 134.166 98.0899 134.167C98.1017 134.165 98.1142 134.163 98.1275 134.16C98.2651 134.132 98.4509 134.093 98.6855 134.043C99.1537 133.942 99.793 133.801 100.584 133.622C102.164 133.265 104.33 132.764 106.902 132.156C112.046 130.941 118.803 129.304 125.73 127.546C132.661 125.788 139.745 123.913 145.551 122.224C148.455 121.379 151.019 120.586 153.076 119.881C155.182 119.16 156.604 118.581 157.323 118.182C158.129 117.734 159.007 116.712 159.814 114.89C160.603 113.11 161.201 110.845 161.627 108.342Z" fill="#C7C9CB"></path>
<path d="M99.3972 117.213L99.9628 114.778L99.3972 117.213C100.013 117.356 100.655 117.33 101.257 117.137L161.664 97.776C165.172 96.6515 164.785 91.5671 161.147 90.9867L120.465 84.4976C119.958 84.4167 119.439 84.4483 118.946 84.5902L119.635 86.9878L118.946 84.5902L60.4093 101.426C56.9406 102.424 57.0692 107.382 60.5849 108.199L99.3972 117.213Z" fill="#909398" stroke="#DDDDDD" stroke-width="5"></path>
<g opacity="0.06">
<path fill-rule="evenodd" clip-rule="evenodd" d="M145.81 17.0204C145.522 16.9903 145.231 17.0104 144.95 17.0799C127.461 21.4029 119.698 29.5255 117.467 35.2669L114.872 34.9831C114.573 34.9504 114.271 34.9719 113.979 35.0467L40.752 53.8371C39.5948 54.134 38.8094 55.2082 38.8774 56.401C38.9135 57.0328 39.1836 57.6043 39.6056 58.0264L47.2576 81.1222C46.6394 81.6249 46.2799 82.4093 46.3409 83.2449C46.4277 84.4321 47.3396 85.3934 48.5205 85.5428L48.7311 85.5695L55.5 106L58 103.5L52.9372 86.1016L65.8106 87.7301L69 107.5L74.5 109L71.097 88.3989L92.5084 91.1076L95.5 113.5L100.46 114.563L97.3581 90.7612L114.871 86.2285L115 88.5L119.946 87.1084L121.225 106.713L126.214 106.388L124.733 83.6759L144.984 78.4345V100.5L149.984 99.0897V77.1404L162.106 74.0029L160 95.5L165.17 94.6329L167.381 71.7935C167.589 71.3985 167.693 70.9447 167.664 70.4728C167.652 70.2775 167.618 70.0881 167.563 69.9072L170.075 43.9474C170.552 42.8161 171.763 41.3766 173.839 39.7301C175.959 38.0483 178.708 36.3635 181.733 34.7679C187.78 31.5796 194.652 28.894 199.119 27.4051C200.236 27.0329 200.941 25.9323 200.814 24.7622C200.686 23.5921 199.759 22.6696 198.589 22.547L145.81 17.0204ZM166.202 40.5973C167.296 38.8348 168.941 37.2325 170.732 35.8126C173.186 33.8658 176.23 32.0171 179.401 30.3451C182.1 28.9218 184.942 27.6001 187.675 26.4316L145.728 22.0392C130.969 25.7761 124.859 32.0283 122.729 35.8424L166.202 40.5973ZM114.581 81.1387L113.808 67.5504L95.0162 72.7875L96.7071 85.7649L114.581 81.1387ZM113.517 62.4409L113.379 60.0139L94.0102 65.0668L94.3636 67.7789L113.517 62.4409ZM153.885 44.2799L118.092 53.6172L117.277 40.2759L153.885 44.2799ZM113.09 54.9222L112.277 40.6454L91.5221 45.9713L93.3591 60.0693L113.09 54.9222ZM162.715 67.7879L164.791 46.6023L149.984 50.4649V66.1336L162.715 67.7879ZM144.984 65.4839V51.7693L123.026 57.4975L123.363 62.6744L144.984 65.4839ZM123.695 67.7595L144.984 70.5259V73.2698L124.402 78.5969L123.695 67.7595ZM89.5702 69.1147L89.07 65.3703L66.7845 62.2922L68.8647 74.8851L89.5702 69.1147ZM69.6843 79.8472L90.2388 74.1189L91.8235 85.9811L70.2467 83.2515L69.6843 79.8472ZM63.9589 76.2523L61.591 61.5749L45.1388 59.3025L51.1129 79.8323L63.9589 76.2523ZM64.7602 81.2195L64.9806 82.5853L61.4583 82.1397L64.7602 81.2195ZM149.984 71.9757V71.1756L152.042 71.443L149.984 71.9757ZM88.383 60.228L86.6455 47.2227L54.3058 55.5212L88.383 60.228Z" fill="#212732"></path>
</g>
<path fill-rule="evenodd" clip-rule="evenodd" d="M148.021 17.0204C147.733 16.9903 147.442 17.0104 147.16 17.0799C129.672 21.4029 121.909 29.5255 119.678 35.2669L117.083 34.9831C116.784 34.9504 116.481 34.9719 116.19 35.0467L42.9627 53.8371C41.8055 54.134 41.0201 55.2082 41.0881 56.401C41.1223 56.9998 41.3668 57.5445 41.7515 57.9591L48.7542 82.0611C48.5954 82.4239 48.5212 82.828 48.5516 83.2449C48.6091 84.0308 49.0281 84.7178 49.6475 85.1357L56 107L60 104L54.9151 86.0721L68.0408 87.7326L71.5125 109.161L77 110L73.3809 88.4082L94.3759 91.0642L97.4098 115.225L102.371 114.603L99.3831 90.8093L117.413 86.1426L117.5 87.5L118.784 87.2148L120.208 109.062L125.198 108.737L123.62 84.5363L147.195 78.4345V100.5L152.195 99.0897V77.1404L164.157 74.0442L162 95H166.5L169.046 72.4918C169.602 71.9945 169.924 71.2586 169.875 70.4728C169.845 69.9949 169.682 69.5522 169.42 69.1832L172.27 43.986C172.736 42.849 173.95 41.3954 176.05 39.7301C178.17 38.0483 180.918 36.3635 183.944 34.7679C189.99 31.5796 196.863 28.894 201.33 27.4051C202.446 27.0329 203.152 25.9323 203.024 24.7622C202.897 23.5921 201.97 22.6696 200.8 22.547L148.021 17.0204ZM168.413 40.5973C169.507 38.8348 171.152 37.2325 172.943 35.8126C175.397 33.8658 178.441 32.0171 181.612 30.3451C184.311 28.9218 187.153 27.6001 189.886 26.4316L147.939 22.0392C133.18 25.7761 127.069 32.0283 124.94 35.8424L168.413 40.5973ZM117.089 81.0618L116.223 67.4935L97.1237 72.8163L98.755 85.8071L117.089 81.0618ZM115.897 62.3937L115.743 59.9741L96.1529 65.0845L96.494 67.8012L115.897 62.3937ZM156.096 44.2799L120.201 53.6438L119.469 40.2738L156.096 44.2799ZM115.418 54.8914L114.509 40.6401L93.7522 45.9663L95.5246 60.0811L115.418 54.8914ZM164.803 67.7719L166.982 46.6075L152.195 50.4649V66.1336L164.803 67.7719ZM147.195 65.4839V51.7693L121.913 58.3646L122.165 62.2314L147.195 65.4839ZM122.496 67.3165L147.195 70.5259V73.2698L123.288 79.4573L122.496 67.3165ZM91.6251 69.1581L91.1472 65.3519L69.0036 62.2934L71.1124 74.8748L91.6251 69.1581ZM71.9436 79.8337L92.2549 74.1732L93.7328 85.9429L72.5178 83.2591L71.9436 79.8337ZM66.1804 76.2493L63.803 61.5751L47.3212 59.2986L53.1583 79.8784L66.1804 76.2493ZM66.985 81.2156L67.2072 82.5873L63.669 82.1397L66.985 81.2156ZM152.195 71.9757V71.1756L154.253 71.443L152.195 71.9757ZM90.5022 60.2153L88.8702 47.2191L56.5164 55.5212L90.5022 60.2153Z" fill="#DDDDDD"></path>
<path fill-rule="evenodd" clip-rule="evenodd" d="M146.439 14.1609C147.058 14.0078 147.699 13.9635 148.334 14.0299L201.113 19.5565C203.691 19.8265 205.732 21.8586 206.013 24.436C206.295 27.0133 204.74 29.4378 202.281 30.2577C198.661 31.4643 193.368 33.4966 188.285 35.9474L184.903 28.9331L148.164 25.0861C143.834 26.2168 140.332 27.5691 137.522 28.9813L132.577 19.1401C136.394 17.2222 140.975 15.5116 146.439 14.1609Z" fill="#2C96DF"></path>
<path d="M101.333 137.5C101.333 143.928 106.407 149.139 112.666 149.139C114.068 149.139 115.41 148.878 116.648 148.401V126.598C115.41 126.121 114.068 125.86 112.666 125.86C106.407 125.86 101.333 131.071 101.333 137.5Z" fill="#909398"></path>
<path d="M123.5 137.499C123.5 143.438 119.774 148.027 115.423 148.027C111.072 148.027 107.346 143.438 107.346 137.499C107.346 131.561 111.072 126.972 115.423 126.972C119.774 126.972 123.5 131.561 123.5 137.499Z" fill="white" stroke="#E8E9EA"></path>
<ellipse cx="115.423" cy="137.499" rx="3.06314" ry="3.67577" fill="#595D66"></ellipse>
<path d="M143.339 126.446C143.339 132.246 147.917 136.947 153.563 136.947C154.827 136.947 156.038 136.711 157.155 136.28V116.612C156.038 116.181 154.827 115.946 153.563 115.946C147.917 115.946 143.339 120.647 143.339 126.446Z" fill="#909398"></path>
<path d="M163.287 126.446C163.287 131.788 159.937 135.894 156.05 135.894C152.163 135.894 148.813 131.788 148.813 126.446C148.813 121.104 152.163 116.998 156.05 116.998C159.937 116.998 163.287 121.104 163.287 126.446Z" fill="white" stroke="#E8E9EA"></path>
<ellipse cx="156.05" cy="126.446" rx="2.76329" ry="3.31595" fill="#595D66"></ellipse>
</svg>