有什么方法可以使用 Raphael js 库绘制表格答案

【问题标题】：Is there any way to draw a table using Raphael js library有什么方法可以使用 Raphael js 库绘制表格
【发布时间】：2013-04-16 21:31:49
【问题描述】：

我正在使用 Raphael JS 创建类似 ERD 的工具，但不知道如何使用 Raphael 创建类似表格的实例。

【问题讨论】：

你是什么表？
你需要 .rect 和 .text 方法
我的意思是像桌子一样的菜单

标签： javascript raphael

【解决方案1】：

paper = new Raphael(0,0,500,500);

var x = 100;
var y = 50;
var height = 50
var width = 100;

WriteTableRow(x,y,width*2,height,paper,"TOP Title");
y= y+height;
WriteTableRow(x,y,width,height,paper,"Score,Player");
y= y+height;
for (i=1;i<=4;i++)
{
var k;
k = Math.floor(Math.random() * (10 + 1 - 5) + 5);
WriteTableRow(x,y,width,height,paper,i+","+ k + "");
y= y+height;
}


function WriteTableRow(x,y,width,height,paper,TDdata)
{
    var TD = TDdata.split(",");
    for (j=0;j<TD.length;j++)
    {
        var rect = paper.rect(x,y,width,height).attr({"fill":"white","stroke":"red"});
        paper.text(x+width/2, y+height/2, TD[j]) 
        x = x + width;
    }
}

//http://jsfiddle.net/LG5zn/116/

【讨论】：

【解决方案2】：

Raphael 可以绘制任何东西，但是如果您要手动创建表格等等，那么您可能会与框架作斗争。我最喜欢这个库的一个方面是它可以与传统的 HTML、CSS 和 Javascript 无缝协作。我强烈建议您从 HCJ 那里获得您想要的东西，并将 Raphael 用于任何不容易做到的事情。

【讨论】：