svg相关内容

如何使用SVG图片作为背景?

我必须做错事。该图像作为SVG从图形输出,(我不知道这是否相关),它有一些像素数据。 这是我的JSFiddle示例。 请注意,直接图片,它显示得很好: http://ykcreations.com/tv.svg 修改:此选项在Chrome或Safari中无法使用,但在Firefox中却无法使用。 Webkit问题? 解决方案 您的源SVG有问题。查看此更新的指向其他SVG文 ..
发布时间:2017-02-09 14:47:33 前端开发

创建rouded箭头

我想要创建一个类似这样的箭头: 但是,这是我可以得到的最接近: .button {margin:4em 0; padding:2em;宽度:15%; margin:0 auto; text-align:center; background-color:#000000; color:#ffffff;显示:-moz-box; display:-ms-flexbox;显示:-webkit- ..
发布时间:2017-02-09 14:30:57 前端开发

在Firefox中不遵守SVG的变换原点百分比,有时在WebKit中

我有这个冰激凌锥形SVG图形,我想用 transform-origin 的 50%100% code>(中间底部)。 Firefox声称服从(即检查员注意到正确的 transform-origin ),但实际上是围绕左上角转换。 WebKit,奇怪的是,只有当父元素 font-size:100%设置时才会服从。 非常类似的问题,但只适用于Firefox: 在SVG上设置转换原点在Fir ..
发布时间:2017-02-09 13:51:22 前端开发

svg在视口中时触发动画

svg在视口中时触发动画 我有一个大页眉图像和一个svg动画在折叠下面的页面。 以下是示例: html,body {height:100%; margin:0} .header-image {height:100%; background-color:#ffcc00} / *行动画* /。line {stroke-dasharray:150; stroke-dashoffset:1 ..
发布时间:2017-02-09 11:57:23 前端开发

如何缩放SVG内的链接图像从顶部(当前缩放从中心奇怪)

我有一个以内联SVG链接的图片,SVG的高度和宽度值已删除。当维度选项设置为百分比时,图像似乎消失了,所以我将它们保持在px值,这是SVG似乎保持为其高度。 此链接将演示我想要实现的更简单:示例 基本上我想要的SVG的行为像上面的图像,但链接的图像是从它的SVG容器的中心而不是顶部。 谢谢, -n 解决方案 必须做的是添加 svg { max-height ..
发布时间:2017-02-09 10:47:20 前端开发

堆叠条形图标签 - D3

我正在向d3中的堆叠条形图添加数据标签。 我想将数据标签放在栏的中间。到目前为止,我只是想出了如何在每个栏的顶部添加数据标签。 这是我的代码: var width = 750, height = 500; var x = d3.scale.ordinal() .rangeRoundBands([0,width],.1); var y = d3.scale.l ..
发布时间:2017-02-09 10:17:58 前端开发

SVG sprite背景位置交叉浏览器变体

这是转贴 SVG作为背景图片,跨浏览器兼容性 由于我觉得我没有得到答案,因为我的问题不明确,我再次发布。 我有一个问题,偏移(背景位置)的svg sprite在不同的浏览器是不同的。 显然,偏移量需要针对不同的浏览器进行调整。 // Chrome Safari .some { background:transparent url('some.png' )no-repe ..
发布时间:2017-02-09 09:49:19 前端开发

用SVG填充半个星星

对于我正在建设的评分系统。 请参阅jsbin: http://jsbin.com/cifip/2/ 在这个例子当前填充是一个黄色。如果我添加类是半,我想它显示一半灰色,并有黄色。 这是否可以在SVG中执行? 解决方案 填充星。 2个站点可确保即时转换。 ..
发布时间:2017-02-08 00:16:37 前端开发

使用D3用背景图像填充svg

我已经发布了一些关于这个的其他问题,现在已经放弃了我以前的引导框架为一个固体的svg条使用D3。 我的目标是有3三角形遮蔽3个图像,即可点击以仅在三角形内部的页面锚点链接。 (理想情况下,我想在悬停上添加一个过渡到圆效果,但我现在不担心)。 我有下面的jsfiddle ,但是不能管理去旋转三角形内的图像,或者使背景只是一个单个图像,而不是现在的覆盖。我尝试了CSS background ..
发布时间:2017-02-07 23:27:40 前端开发

使用HTML中的SVG绘制新月

是否可以使用SVG在HTML中绘制新月? 我一直在尝试在 W3学校,但我没有看到一个例子这个的。我不需要你在'crescent moon'的典型谷歌图片中看到的任何阴影,只是一个坚固的边框新月。 解决方案 请注意,我的解决方案可能不是最好的。我不是一个专家,当它涉及到矢量图形,你应该肯定寻找其他解决方案 我采取的方法是绘制另一个图像具有相同的背景。它将如下所示: 若要消除额外 ..
发布时间:2017-02-07 22:56:13 前端开发

单击部分透明图像上的透明区域

给定一些形状,我希望它可以点击其填充的部分,而不是可点击(因此点击到它后面的元素)在其透明部分。以下是三角形形状的示例: http://img138.imageshack.us /img138/1276/e4t.png 黑线是边框线。我想要能够选择文本,或者与边界框(绿色轮廓区域)内的任何元素进行交互,但不能用填充的部分覆盖。 我尝试SVG与指针事件设置为每个可能的值,但它似乎不工作 ..
发布时间:2017-02-07 22:13:04 前端开发

将内联SVG转换为png时的样式化错误

我的高级目标是将包含一些内联svg图像的 元素转换为png文件。所有操作都必须在客户端浏览器中使用JavaScript执行。我尝试过: 使用canvg库并按照此帖中的步骤操作: https://github.com/niklasvh/html2canvas/issues/95#issuecomment-34439223 原始svg: 结果: 将css ..
发布时间:2017-02-07 21:50:29 前端开发