2

我正在为我的响应式 web 应用程序寻找图形解决方案。我真的很喜欢这个Raphael分析演示：http : //raphaeljs.com/analytics.html（这里是 JS Bin：http: //jsbin.com/svg/1/edit）

...但它没有响应。我在 codepen 上找到了这个响应式 SVG 图：http://codepen.io/meloncholy/pen/KxiJA ，但我正在寻找像 Raphaël 这样的 JavaScript 集成解决方案，而不仅仅是静态 SVG。

有什么方法可以将两者结合起来以使 Raphaël 图形响应？

这是 codepen 演示的作者关于他如何制作响应式 SVG 的文章：http: //meloncholy.com/blog/making-responsive-svg-graphs/

4

1 回答 1

0

window.onload您发布的 Raphaël 演示会在事件触发时呈现图表。Demo 使用var r = Raphael("holder", width, height)固定宽度的舞台生成并800px在此处的某处绘制图形r.drawGrid(...)。

与您发布的 codepen.io 示例类似，您可以根据window.resize事件窗口的宽度以不同的宽度重新初始化/重绘整个事物。

第二种方法，您使用类似于codepen.io 示例中window.resize的类似函数遍历事件中的所有 SVG 元素。var unscale = function (el) { ... }

只是一些想法...

于 2013-06-04T15:39:11.327 回答