0

我想创建一个由 div 组成的 UserControl。在 div 里面会有一些 SVG 渲染的盒子。有多少盒子和它们的相对位置将由数据确定。

数据将采用 Box 类列表的形式,其中 Box 如下:

 public class SVGBox
 {
    public int x { get; set; }  // x coordinate of a corner
    public int y { get; set; }  // x coordinate of same corner
    public int l { get; set; }  // length
    public int h { get; set; }  // height
    public string Color { get; set; }
    public string text { get; set; }
    public string uniqueKey { get; set; }

    public SVGBox (int X, int Y, int H, int W, string Text, string Key )
    {
        x = X;
        y = Y;
        h = H;
        w = W;
        text = Text;
        uniqueKey = Key;
    }
 }  

我有一个在'Net 上找到的用于从 C# 渲染 SVG 的示例,但它涉及用 DOCTYPE 中的特定引用写出整个 HTML 页面。如何在用户控件中执行此操作?

4

1 回答 1

0

好的,一旦我得到了正确的开始,还不错。

在 ascx 中,我只是添加了一个 asp:Literal。这是背后的代码:

public partial class Controls_SVGTest : System.Web.UI.UserControl
{
    public int Height { get; set; }
    public int Width { get; set; }
    public List<SVGBox> data { get; set; }

    const string HeaderText = "<?xml version=\"1.0\" encoding=\"utf-8\" ?> <svg xmlns=\"http://www.w3.org/2000/svg\" " +
                                "xmlns:xlink=\"http://www.w3.org/1999/xlink\" height=\"{0}\" width=\"{1}\" >";

    const string BoxSVG = "<rect x=\"{0}\" y=\"{1}\" height=\"{2}\" width=\"{3}\" rx=\"2\" fill=\"{4}\" stroke=\"#707070\" />";
    const string Footer = "</svg>";


    protected void Page_Load(object sender, EventArgs e)
    {
        LoadSVG();
    }

    public void LoadSVG()
    {
        Literal1.Text = String.Format(HeaderText, Height.ToString(), Width.ToString());
        foreach (SVGBox s in data)
        {
            Literal1.Text += String.Format(BoxSVG, s.x, s.y, s.h, s.w, s.Color);
        }
        Literal1.Text += Footer;
    }

}
于 2013-01-18T22:44:25.083 回答