草庐IT

svg-edit

全部标签

node.js - D3js : how to generate standalone SVG files? (Nodejs)

给定一个D3js代码,suchas:varsquare=function(){varsvg=window.d3.select("body").append("svg").attr("width",100).attr("height",100);svg.append("rect").attr("x",10).attr("y",10).attr("width",80).attr("height",80).style("fill","orange");}square();svg{border:1pxsolidgrey;}/*justtovisualizedthesvgfile'sarea*/

javascript:如何在 HTML img 元素支持中检测 SVG?

javascript:如何在HTMLimg元素支持中检测SVG?我试过了,但是没用:x=newImage();x.onload=function(){if(x.width){alert('svginimgtagsupported!');}};x.src='test.svg'; 最佳答案 这里有一个很好的方法讨论/比较:http://www.voormedia.nl/blog/2012/10/displaying-and-detecting-support-for-svg-images基于那个页面,我最终使用了这个:svgsuppor

javascript - 分机JS : How to disable cell editing for individual cells in a grid?

我现在正在使用Ext-JS4.0.2构建一个Web应用程序,我正在使用一个可编辑的网格来控制要在同一页面上为表格显示的数据。为了使网格可编辑,我遵循了API文档并使用了以下内容:selType:'cellmodel',plugins:[Ext.create('Ext.grid.plugin.CellEditing',{clicksToEdit:2})]但是,对于此网格,有几个单元格不应更改。我可以简单地让事件处理程序在网格中更改数据后将其更改回正确的状态,但这似乎很麻烦,难以维护且不可读。有没有更好的方法来做到这一点?我阅读了API,但找不到任何有用的属性。更新对于这个特定的应用程序,

xml - 根据 DTD 使用自定义命名空间验证 SVG

我生成的SVG如下所示如果没有自定义属性foo(和命名空间foobar),整个SVG将根据DTD进行验证。显然,我错误地使用了自定义命名空间,因为添加foobar命名空间和相关属性会导致xmllint验证失败,从xmlns:foobar的声明开始=...,它本身不是svg的元素。我的声明有误吗?在使用自定义命名空间/属性时甚至可以根据DTD进行验证吗? 最佳答案 假设您要根据SVG1.1第2版进行验证。DTD的官方URL如下所示,您可以通过重新定义(“抢占”)SVG.External.attrib参数的默认空字符串值来利用SVGDT

javascript - Raphael JS - 即时解析 SVG

我在http://bkp.ee/atirip/找到了一个简洁的SVG解析器它解析SVG文件并将其输出到使用RaphaelJS库(raphaeljs.com)的javascript。您会在源代码中注意到http://bkp.ee/atirip/svg2rdemo.php:jQuery(document).ready(function(){$("#c1").each(function(){varc=Raphael(this,190,154,0,0);varg1=c.set();...它创建了g1、g2等变量。但它也重用了这些变量。我想为每个组创建唯一的变量。在我的.ai文件中,我已经命名了

javascript - 如何在运行时添加 SVG 元素 - Angular

我将通过单击按钮添加一个SVG元素:myApp.directive('addRectangle',function(){returnfunction(scope,element,attr){element.bind('click',function(){scope.rectCount++;angular.element(document.getElementsByClassName('svgMain')).append('');});}});该元素将如我所料正确添加,但问题是它没有显示在相关位置!我已经检查了页面的源html,对此我完全确定。这是这个问题的fiddle:jsfiddle

javascript - 查找 SVG 路径的交集

是否有一种已知的方法可以找到SVG路径与其自身的交点?以&符号为例,&,它是一条与自身相交于两点的线。我遇到了一个intersectionlibrary但它似乎在谈论两个相交的形状,而不是一个自相交的形状。我熟悉d3,所以任何基于javascript的答案都很好,但也很高兴听到可以使用什么数学方法。谢谢 最佳答案 你是对的-KevinLindsey(@thelonious)的库似乎可以在这里完成这项工作。你告诉库寻找相同形状的两个实例之间的交点,去掉Vector2D对象,剩下的是2组相同的交点(Point2D在他的库中键入对象)。这

JavaScript - 使用 SVG 图表 + HTML 和图像导出 Div

我们有一个使用highchartjs库并将图表呈现为SVG的angularjs应用程序。我们制作了几个显示数据组合的小部件,假设在一些小部件中我们只有SVG图表,在一些小部件中我们只有用AngularDirective(指令)呈现的表格数据,而在一些小部件中我们有两者的组合,即一些图表+一些HTML(它可以是简单的项目符号列表,也可以是用Angular呈现的表格数据)。现在我们想要提供功能,以便每个小部件都可以导出为图像。我们遇到了这个例子jsfiddle.net/8ypxW/3/,它使用html2canvas库并且可以很好地处理纯HTML数据,但是SVG图表不会用这个导出。我们想通过

javascript - 在 Raphael (SVG/VML) 形状中呈现 HTML *的想法

我正在开发一个使用Raphael的应用程序绘制原始形状(矩形、椭圆、三Angular形等)和线条,但也允许用户移动/调整这些对象的大小。主要要求之一是形状的表面可以有格式化的文本。实际文本是Markdown的子集(简单的东西,如粗体、斜体、列表)并呈现为HTML。FWIW-我正在使用Backbone.jsView来模块化形状逻辑。方法一我最初的想法是使用foreignObjectforSVG的组合并使用用于IE的VML直接HTML。然而,IE9doesn'tsupportforeignObject,因此不得不放弃这种方法。方法二在Canvas对象旁边,添加包含实际HTML的div。然后

javascript - svg/d3 中轴转换的语法

我有一个非常基本的语法问题。我主要是通过编辑别人的代码来学习d3、SVG和Javascript,这很有挑战性。目标是在更新数据后更新一个y轴,比例尺是根据数据来的。我希望轴——刻度和标签以及所有——随数据域转换。轴没有得到更新。问题可能与范围有关,或者我引用了错误的SVG元素。(实际上有几个图同时更新,但我在这里只关注其中一个的轴。)functionmakeYaxis(chart,scale,nticks,label,width,height,xmf,visName){varyAxis=d3.svg.axis().scale(scale).orient("left").ticks(nt