我使用Javascript / Jquery创建了HTML 5 SVG图表。请参阅下面的SVG元素。
<svg id="container_svg" style="width: 1350px; height: 600px;"><rect id="container_svg_SvgRect" x="0" y="0" width="1350" height="600" fill="transparent" stroke-width="0" stroke="transparent"/><rect id="container_svg_ChartArea" x="89.5" y="58" width="1240.5" height="448.5" fill="transparent" stroke-width="0.5" opacity="0.3" stroke="Gray"/><g id="container_svg_XAxis"><g id="container_svg_XAxisGrid_0"><defs><clipPath id="container_svg_XAxisGrid_0_XTicksClipRect"><rect id="container_svg_XAxisGrid_0_XTicksClipRect" x="89.5" y="506.5" width="1240" height="20.5" fill="white" stroke-width="1" stroke="transparent"/></clipPath></defs><line id="container_svg_XAxisLine" x1="89.5" y1="506.5" x2="1329.5" y2="506.5" stroke-dasharray="" stroke-width="0.5" stroke="#686868"/><path id="container_svg_XAxisMajorTicks" fill="none" stroke-width="0.8" stroke="#B7B7B7" clip-path="url(#container_svg_XAxisGrid_0_XTicksClipRect)" d="M 89.5 511.75 L 89.5 506.75 M 213.5 511.75 L 213.5 506.75 M 337.5 511.75 L 337.5 506.75 M 461.5 511.75 L 461.5 506.75 M 586.5 511.75 L 586.5 506.75 M 709.5 511.75 L 709.5 506.75 M 833.5 511.75 L 833.5 506.75 M 957.5 511.75 L 957.5 506.75 M 1082.5 511.75 L 1082.5 506.75 M 1206.5 511.75 L 1206.5 506.75 M 1329.5 511.75 L 1329.5 506.75 "/><path id="container_svg_XAxisMajorGridLines" fill="none" stroke-width="0.5" stroke="#B7B7B7" opacity="0.3" stroke-dasharray="" clip-path="url(#container_svg_ChartAreaClipRect)" d="M 89.5 506.5 L 89.5 58 M 213.5 506.5 L 213.5 58 M 337.5 506.5 L 337.5 58 M 461.5 506.5 L 461.5 58 M 586.5 506.5 L 586.5 58 M 709.5 506.5 L 709.5 58 M 833.5 506.5 L 833.5 58 M 957.5 506.5 L 957.5 58 M 1082.5 506.5 L 1082.5 58 M 1206.5 506.5 L 1206.5 58 "/></g><g id="container_svg_XAxisLabels_0" clip-path="url(#container_svg_XLabelClipRect)"><defs><clipPath id="container_svg_XLabelClipRect"><rect id="container_svg_XLabelClipRect" x="0" y="0" width="1350" height="600" stroke="transparent"/></clipPath></defs><text id="container_svg_XLabel_0" x="89.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2000</text><text id="container_svg_XLabel_1" x="212.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2001</text><text id="container_svg_XLabel_2" x="336.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2002</text><text id="container_svg_XLabel_3" x="460.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2003</text><text id="container_svg_XLabel_4" x="585.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2004</text><text id="container_svg_XLabel_5" x="709.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2005</text><text id="container_svg_XLabel_6" x="832.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2006</text><text id="container_svg_XLabel_7" x="956.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2007</text><text id="container_svg_XLabel_8" x="1081.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2008</text><text id="container_svg_XLabel_9" x="1205.5" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle">Jul-2009</text><text id="container_svg_XLabel_10" x="1348" y="524.25" fill="#707070" font-size="11px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">Jul-2010</text></g></g><g id="container_svg_YAxis"><g id="container_svg_YAxisGrid_1"><line id="container_svg_YAxisLine" x1="89.5" y1="506.5" x2="89.5" y2="58.5" stroke-width="0.5" stroke-dasharray="" stroke="#686868"/><defs><clipPath id="container_svg_YAxisGrid_1_YTicksClipRect"><rect id="container_svg_YAxisGrid_1_YTicksClipRect" x="60" y="58.5" width="29.5" height="448" fill="white" stroke-width="1" stroke="transparent"/></clipPath></defs><path id="container_svg_YAxisMajorTicks" fill="none" stroke-width="1" stroke="#B7B7B7" clip-path="url(#container_svg_YAxisGrid_1_YTicksClipRect)" d="M 84.25 506.5 L 89.25 506.5 M 84.25 461.7 L 89.25 461.7 M 84.25 416.9 L 89.25 416.9 M 84.25 372.1 L 89.25 372.1 M 84.25 327.29999999999995 L 89.25 327.29999999999995 M 84.25 282.5 L 89.25 282.5 M 84.25 237.7 L 89.25 237.7 M 84.25 192.90000000000003 L 89.25 192.90000000000003 M 84.25 148.09999999999997 L 89.25 148.09999999999997 M 84.25 103.30000000000001 L 89.25 103.30000000000001 M 84.25 58.5 L 89.25 58.5 "/><path id="container_svg_YAxisMajorGridLines" fill="none" stroke-width="0.5" opacity="0.3" stroke-dasharray="" stroke="#B7B7B7" clip-path="url(#container_svg_ChartAreaClipRect)" d="M 89.5 506.5 L 1330 506.5 M 89.5 461.7 L 1330 461.7 M 89.5 416.9 L 1330 416.9 M 89.5 372.1 L 1330 372.1 M 89.5 327.29999999999995 L 1330 327.29999999999995 M 89.5 282.5 L 1330 282.5 M 89.5 237.7 L 1330 237.7 M 89.5 192.90000000000003 L 1330 192.90000000000003 M 89.5 148.09999999999997 L 1330 148.09999999999997 M 89.5 103.30000000000001 L 1330 103.30000000000001 M 89.5 58.5 L 1330 58.5 "/></g><g id="container_svg_YAxisLabels_1"><text id="container_svg_YLabel_0" x="79.25" y="509.5" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$0</text><text id="container_svg_YLabel_1" x="79.25" y="464.7" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$10</text><text id="container_svg_YLabel_2" x="79.25" y="419.9" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$20</text><text id="container_svg_YLabel_3" x="79.25" y="375.1" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$30</text><text id="container_svg_YLabel_4" x="79.25" y="330.29999999999995" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$40</text><text id="container_svg_YLabel_5" x="79.25" y="285.5" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$50</text><text id="container_svg_YLabel_6" x="79.25" y="240.7" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$60</text><text id="container_svg_YLabel_7" x="79.25" y="195.90000000000003" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$70</text><text id="container_svg_YLabel_8" x="79.25" y="151.09999999999997" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$80</text><text id="container_svg_YLabel_9" x="79.25" y="106.30000000000001" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$90</text><text id="container_svg_YLabel_10" x="79.25" y="61.5" fill="#707070" font-size="12px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="end">$100</text></g></g><defs><clipPath id="container_svg_ChartAreaClipRect"><rect id="container_svg_ChartAreaClipRect" x="89.5" y="58" width="1240.5" height="448.5" fill="white" stroke-width="1" stroke="Gray"/></clipPath></defs><g id="container_svg_TitleCollection"><text id="container_svg_XAxisTitle_0" x="709.5" y="547" fill="#707070" font-size="14px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle" dominant-baseline="middle">Sales Across Years</text><text id="container_svg_YAxisTitle_1" x="30" y="282.5" fill="#707070" transform="rotate(-90,30,282.5)" font-size="14px" font-family="Segoe UI" font-style="Normal " font-weight="regular" opacity="1" text-anchor="middle" dominant-baseline="middle">Sales Amount in millions(USD)</text><text id="container_svg_ChartTitle" x="592.25" y="39" fill="#707070" font-size="20px" font-family="Segoe UI" font-style="Normal " font-weight="regular" text-anchor="start">Average Sales Comparsion</text></g><g id="container_svg_SeriesCollection" clip-path="url(#container_svg_ChartAreaClipRect)"><g id="container_svg_SeriesGroup_0" transform="translate(89.5,506.5)" clip-path="url(#container_svg_SeriesGroup_0_ClipRect)"><path id="container_svg_Sales_0" fill="none" stroke-dasharray="" stroke-width="3" stroke="#E94649" stroke-linecap="butt" stroke-linejoin="round" d="M 3.3953997809419496 -44.800000000000004 L 219.00328587075578 -134.4 M 219.00328587075578 -134.4 L 466.86746987951807 -67.2 M 466.86746987951807 -67.2 L 722.880613362541 -291.2 M 722.880613362541 -291.2 L 963.6144578313254 -403.2 M 963.6144578313254 -403.2 L 1211.4786418400877 -380.8 "/><defs><clipPath id="container_svg_SeriesGroup_0_ClipRect"><rect id="container_svg_SeriesGroup_0_ClipRect" x="3.39453125" y="-406.19921875" width="1208.0859375" height="364.3984375" fill="white" stroke-width="1" stroke="transparent" style="display: inline-block; width: 1208.09px;"/></clipPath></defs></g><g id="container_svg_symbolGroup_0" transform="translate(89.5,506.5)"><circle id="container_svg_circlesymbol_0_0" cx="3.3953997809419496" cy="-44.800000000000004" r="7.0710678118654755" fill="#E94649" stroke-width="3" stroke="white" opacity="1" transform="translate(3.39453125 -44.80078125) scale(1) translate(-3.39453125 44.80078125)"/><circle id="container_svg_circlesymbol_1_0" cx="219.00328587075578" cy="-134.4" r="7.0710678118654755" fill="#E94649" stroke-width="3" stroke="white" opacity="1" transform="translate(219.00390625 -134.400390625) scale(1) translate(-219.00390625 134.400390625)"/><circle id="container_svg_circlesymbol_2_0" cx="466.86746987951807" cy="-67.2" r="7.0710678118654755" fill="#E94649" stroke-width="3" stroke="white" opacity="1" transform="translate(466.8671875 -67.19921875) scale(1) translate(-466.8671875 67.19921875)"/><circle id="container_svg_circlesymbol_3_0" cx="722.880613362541" cy="-291.2" r="7.0710678118654755" fill="#E94649" stroke-width="3" stroke="white" opacity="1" transform="translate(722.880859375 -291.19921875) scale(1) translate(-722.880859375 291.19921875)"/><circle id="container_svg_circlesymbol_4_0" cx="963.6144578313254" cy="-403.2" r="7.0710678118654755" fill="#E94649" stroke-width="3" stroke="white" opacity="1" transform="translate(963.61328125 -403.19921875) scale(1) translate(-963.61328125 403.19921875)"/><circle id="container_svg_circlesymbol_5_0" cx="1211.4786418400877" cy="-380.8" r="7.0710678118654755" fill="#E94649" stroke-width="3" stroke="white" opacity="1" transform="translate(1211.478515625 -380.80078125) scale(1) translate(-1211.478515625 380.80078125)"/></g></g></svg>
我想将此SVG代码转换为VML，因为我需要在IE 5,6,7版本中呈现图表。
如何将SVG元素转换为VML元素。我知道有一个在线工具可以将SVG图像转换为VM元素。
http://vectorconverter.sourceforge.net/
但我没有SVG图像而不是这个只有SVG元素使用这个我想转换成VML代码。
我该怎么做？
是否有任何最佳文档可用于将所有SVG元素转换为VML元素。
答案 0 :(得分：2)
有许多JavaScript库旨在允许旧IE支持SVG图像。
有一个列表here。
他们使用各种技术，并提供各种功能，因此您需要自己评估它们以确定哪种最适合您的情况，但大多数最终将SVG转换为VML作为旧IE的后备
其中一个或两个也使用其他技术（Flash，Silverlight等）进行转换，这可能是一件好事，因为VML可能很慢，而且因为IE不是唯一仍旧的浏览器使用不支持SVG（例如Android 2.3及更早版本）。
但总的来说，这些库的想法是它们对用户和开发人员都是透明的;您只需提供SVG，库就会将其显示给用户。你不必担心它是VML或其他任何东西;所有你需要担心的是SVG。
我注意到您的问题指明您需要支持IE5。我会警告你，很多这些脚本不太可能在IE5中运行。 IE6应该相当安全，但IE5将很难支持。
忽略IE5方面，如果您在JavaScript中创建图像，如问题中暗示的那样，我建议使用Raphael library作为最佳选项。但是试试列出的各种脚本，看看哪些适合你。
希望有所帮助。