草庐IT

javascript - SVG - 如何设置文本行高

似乎line-height是svg文本中缺少的一个CSS属性。我找到的关于SVG的最佳资源是:Jenkov.comSVGTutorials而且没有提到它,也没有couldIfindmentionofitonMDN.因此,如果有人可以明确阐明这一点或分享一项技术。我基本上对环绕的文本行之间的间距感兴趣,而不是独立的文本元素。谢谢 最佳答案 SVG1.1(官方)只支持单行文本,因此没有line-height设置。我刚刚尝试在Inkscape中创建一个文本block,它使用flowRoot元素(包含一个带有实际文本的flowPara元素)

javascript - 饼图、条形图、线 : SVG/VML better than Canvas

我需要为“标准”图表选择一个库:饼图、折线图和条形图。根据我的阅读,在我看来最好的格式是SVG/VML,例如Highcharts。SVG正在成为所有主要浏览器的标准,现在IE9接受了它。它似乎比Canvas更容易重新缩放和导出。不过,我看到有几个图表库依赖于Canvas。我错过了什么吗?对于此类应用程序,是否有任何理由考虑使用Canvas而不是SVG? 最佳答案 您通常可以使用其中任何一种获得相同的结果。两者最终都为用户在屏幕上绘制像素。主要区别在于HTML5Canvas使您可以对结果进行像素级控制(读取和写入),而SVG是一种保留

javascript - map 中浏览器的最大 svg 元素数

我正在用传单和d3创建map。map上会绘制很多圆圈。在浏览器兼容性方面,浏览器可以渲染多少svg元素是有预期限制的。然而,就用户体验而言,我更希望用户可以在map上看到尽可能多的元素(否则用户可能需要不断地放大和缩小,并且需要等待ajax返回数据)。我需要考虑一些优化(用户等待时间用户与服务器查询负载与浏览器可以处理的内容)。看图,现在服务器返回的点数有限制,因此只有一部分map被填充。浏览器无法在此处处理完全填充的map,用户也需要等待服务器响应太久。我想我面临的问题需要通过回答两个问题来解决:对于一般浏览器可以处理map上简单svg形状(圆圈)的数量,是否有标准?在map上显示尽

javascript - 是否有像 Google Charts 这样的 SVG map 库?

关闭。这个问题不符合StackOverflowguidelines.它目前不接受答案。要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于StackOverflow来说是偏离主题的,因为它们往往会吸引自以为是的答案和垃圾邮件。相反,describetheproblem以及迄今为止为解决该问题所做的工作。关闭9年前。Improvethisquestion我正在寻找可以按国家/地区着色的大型世界地图。GoogleCharts有一个API,但它只允许您生成一个小map(440x220像素)。有谁知道使用开源库生成此类map的方法吗?

javascript - 在 Mocha 测试期间需要/导入 svg

我有一个正在使用webpack构建的项目。这允许我导入.svg文件来创建React组件。在运行测试时,我一直试图避免使用webpack以避免将mocha版本绑定(bind)到webpack插件。不幸的是,当.svg导入被命中时,找不到它们。我们还使用了css模块,它们允许我使用css-modules-require-hook来解决导入css文件的问题。有没有一种技术可以用SVG来完成同样的事情? 最佳答案 我看到这个问题是通过使用require.extensions(在节点中是deprecated,但永远不会消失)强制导入这些类型的

javascript - 两个 SVG 元素接触时的事件

是否可以在SVG中使用任何方法调用an即使两个特定元素接触?或者我是否必须编写很长的代码,并弄清楚它们的边界是否涉及复杂的数学? 最佳答案 在SVG1.1DOM中,最外层的SVG元素实际上有四种方法可用于交集处理:getIntersectionListgetEnclosureListcheckIntersectioncheckEnclosure不幸的是,我认为对这些方法的跨浏览器支持仍然不是很好。 关于javascript-两个SVG元素接触时的事件,我们在StackOverflow上找

javascript - Google Charts - 如何将轴标签分成两行? (多个 X 轴)

我的google折线图看起来像这样:10|.|.....----'''''--.09|.-----'''''''-|'.08|\|'.07|'.|________________________________________________________2012/12/2712:012012/12/2612:222012/12/2511:33我希望它看起来像这样(注意X轴标签):10|.|.....----'''''-.09|.-----'''''\|'.08|\|'.07|'.|_______________________________________________2012

javascript - 使用 D3 在 map 上绘制点

我正在尝试使用基于纬度和经度的D3地理库在map上绘制几个点。但是,当我将这些值传递到我的投影函数时,它会导致坐标超出我的SVG图像的范围。我的代码基于thisexampleprovidedinthedocumentation.我已将当前代码放在:http://bl.ocks.org/rpowelll/8312317我的源数据是一个简单的对象数组,格式如下varplaces=[{name:"Wollongong,Australia",location:{latitude:-34.42507,longitude:150.89315}},{name:"Newcastle,Australia

javascript - D3 : Grayscale image display driven by 2D array data

有人知道如何使用d3显示灰度图像,即像素强度的二维数组吗?我似乎无法在任何地方找到它的任何例子,它会很棘手吗?任何帮助/链接/指针表示赞赏! 最佳答案 如果只想显示图像,请使用imageelement和“xlink:href”属性。例如:svg.append("image").attr("xlink:href","my.png").attr("width",960).attr("height",500);如果你想给灰度图像上色,请看这个colorizedheightmapexample它使用分位数来创建发散色标,并使用HCL插值来获

javascript - 使用 D3 画笔进行细粒度事件处理

我有一个使用D3生成的散点图。可以通过单击选择图上的点(SVG圆圈),也可以使用D3画笔选择区域。为了确保圆圈获得点击事件,我需要先创建画笔,以便圆圈位于画笔上方。不幸的是,这意味着当我的光标位于绘图中的某个点上时,我无法通过拖动来创建画笔范围。有没有办法将悬停和点击事件传递给圆圈,但处理与画笔拖动相关的事件? 最佳答案 它可以完成,但需要useoftheD3brushAPI(见下面的注释)。这是一个例子http://bl.ocks.org/4747894其中:brush元素在圆圈后面圆圈响应mousedown事件。(也可以响应其他