由AI生成的SVG在包含后未显示
由AI生成的SVG在包含后未显示
提问于 2012-10-02 10:04:18
我有一个使用生成的.svg文件。这些是SVG文件的结构：
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="1068px" height="1671.49px" viewBox="0 0 1068 1671.49" enable-background="new 0 0 1068 1671.49" xml:space="preserve">
<g>
<polygon fill="#C6C6C6" points="451.07,1979.34 451.07,1979.34 450.8,1979.17 448.72,1978.82 448.6,1978.71 448.34,1978.59
447.71,1978.36 448.01,1978.33 450.2,1978.3 452.53,1978.76 451.35,1979.08 451.73,1979.29 "/>
<!-- more polygon shapes -->
</g>
</svg>然后，我在我的<embed>文件中使用这样的.html标记来包含它。HTML文件的结构：
<!DOCTYPE html>
<html>
<head>
<title>My Demo</title>
<link rel="stylesheet" href="css/style.css" />
<script src="js/jquery-1.8.2.min.js"></script>
<script src="js/raphael-min.js"></script>
<script src="js/script.js"></script>
</head>
<body>
<div id="shape1"></div>
<div id="shape2"></div>
<div id="shape3"></div>
<div id="embed_svg">
<embed src="my_svg_file.svg" type="image/svg+xml" />
</div>
</body>
</html>备注：
- 我不认为这与浏览器支持有关，因为我已经使用raphael.js HTML5库绘制了3种HTML5形状，它们工作得非常完美。(在chrome和firefox上试用)
- 包括这个文件不像它应该的那样工作。浏览器似乎解析它，但它似乎没有显示它。
回答 1
Stack Overflow用户
回答已采纳
发布于 2012-10-02 10:21:44
你的形状中的坐标非常相似，所以多边形覆盖了viewBox区域的一个非常小的部分。
如果您将viewBox的<svg>元素更改为viewBox="448 1977 5 10“，该形状将显示为可见区域现在更加匹配多边形协调，或者使多边形更大。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12688289
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号