使用支持 IE7 的 canvas 或 svg 绘制自定义矩形形状答案

【问题标题】：Draw custom rectangle shape with canvas or svg, which has support for IE7使用支持 IE7 的 canvas 或 svg 绘制自定义矩形形状
【发布时间】：2012-07-04 09:50:29
【问题描述】：

我需要一些方向来使用画布或 svg 甚至使用支持 IE7 的 css 绘制以下自定义形状矩形。

欢迎任何 Javascript Jquery 插件。

http://jsfiddle.net/349x9/1087/ 谢谢

【问题讨论】：

带有 IE7 的画布和 SVG。现在这很有趣。谢谢你让我开心！

标签： jquery html css canvas svg

【解决方案1】：

由于 Canvas 元素在 IE7 中不起作用，我建议您使用 excanvas。它是一个简单的 JavaScript，可以帮助您在页面上呈现 Canvas。只需将其添加到页面的标题中，然后只需添加画布元素并在页面上执行您通常的操作即可使用它。

我已经在这里更新了http://jsfiddle.net/349x9/1088/我实际上已经保存了样本。在 IE 上查看 excanvas 的链接是http://code.google.com/p/explorercanvas/

Canvas 的最佳教程可以在下面找到：-

要了解不同的框架以进一步使用画布，请参阅此链接

10-javascript-canvas-frameworks 一些高级/直观/创造性的工作

【讨论】：

我们如何用画布制作自定义形状。我这样做有问题。我想在里面添加一些文字。谢谢
@Semantic 我已经提到了一些最适合画布教程的网站和一些可以帮助您处理画布的框架。检查我的帖子，我已重新编辑并添加了这些链接。

【解决方案2】：

你可以使用拉斐尔。将代码中的点用于路径所需的坐标。您使用 Raphael 命令创建“画布”...

对于初始化画布的简单命令，请转到此处...

http://raphaeljs.com/

直接在这里玩路径.. http://www.irunmywebsite.com/raphael/additionalhelp.php?q=paper.path

【讨论】：

【解决方案3】：

CSS 边框三角形是一种适用于 IE7 的解决方案，无需 JavaScript：jsfiddle demo。

另一个demo 显示了 4 种直角三角形。

【讨论】：

非常有趣的马特，我会看看这个。看看这是否适合我。
我找到了 Firefox 中对角线边缘模糊抗锯齿的修复并更新了演示。