Drag n Drop

Rich_Harrigan · October 29, 2009, 3:21pm

Hi,

In the EntityRelationship sample there are four nodes. When rearranging a node via drag n drop the UI keeps up with mouse movement pretty well. However, I modified this example to represent the schema of the Northwind database and when rearranging with drag n drop the delay is significant primarily with the tables containing many columns. In case you would like to try this out, following is the code that represents the Northwind schema and is a replacement for the constructor. Also, the northwind database is actually pretty small and I plan to use much larger databases.

Thanks
Rich

I used

Northwood beta 6.0.3

Windows Edition: Windows 7 Professional
Processor: Intel® Core™2 Duo CPU P8400 @ 2.26 GHz 2.27 GHz
Installed Memory (RAM) 4.00 GB
System Type: 64-bit Operating System

    public EntityRelationship()
    {
        InitializeComponent();

        // create and initialize the model for the Diagram
        var model = new GraphLinksModel<Entity, String, String, Relationship>();

        // this is the table information for part of a database schema
        model.NodesSource = new ObservableCollection<Entity>() {
    new Entity() { Key = "Categories",
                   Items=new Attribute[] {
                     new Attribute("CategoryID", true, NodeFigure.None, "Blue"),
                     new Attribute("CategoryName", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Description", false, NodeFigure.None, "Blue"),
                     new Attribute("Picture", false, NodeFigure.None, "Blue") } },
    new Entity() { Key = "CustomerCustomerDemo",
                   Items=new Attribute[] {
                     new Attribute("CustomerID", true, NodeFigure.None, "Yellow"),
                     new Attribute("CustomerTypeID", true, NodeFigure.Cube1, "LightBlue") } },
    new Entity() { Key = "CustomerDemographics",
                   Items=new Attribute[] {
                     new Attribute("CustomerTypeID", true, NodeFigure.None, "Yellow"),
                     new Attribute("CustomerDesc", false, NodeFigure.None, "Red") } },
    new Entity() { Key = "Customers",
                   Items=new Attribute[] {
                     new Attribute("CustomerID", true, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("CompanyName", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("ContactName", false, NodeFigure.None, "LightBlue"),
                     new Attribute("ContactTitle", false, NodeFigure.None, "Blue"),
                     new Attribute("Address", false, NodeFigure.None, "LightBlue"),
                     new Attribute("City", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Region", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("PostalCode", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Country", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Phone", false, NodeFigure.None, "LightBlue"), 
                     new Attribute("Fax", false, NodeFigure.None, "Red") } },       
    new Entity() { Key = "Employees",
                   Items=new Attribute[] {
                     new Attribute("EmployeeID", true, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("LastName", false, NodeFigure.None, ""),
                     new Attribute("FirstName", false, NodeFigure.None, ""),
                     new Attribute("Title", false, NodeFigure.None, ""),
                     new Attribute("TitleOfCourtesy", false, NodeFigure.None, ""),
                     new Attribute("BirthDate", false, NodeFigure.None, ""),
                     new Attribute("HireDate", false, NodeFigure.None, ""),
                     new Attribute("Address", false, NodeFigure.None, ""),
                     new Attribute("City", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Region", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("PostalCode", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Country", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("HomePhone", false, NodeFigure.None, ""),
                     new Attribute("Extension", false, NodeFigure.None, ""),
                     new Attribute("Photo", false,NodeFigure.None, ""),
                     new Attribute("Notes", false, NodeFigure.None, ""),
                     new Attribute("ReportsTo", false, NodeFigure.None, ""),
                     new Attribute("PhotoPath", false, NodeFigure.None, "") } },
    new Entity() { Key = "Employees2",
                   Items=new Attribute[] {
                     new Attribute("EmployeeID", true, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("LastName", false, NodeFigure.None, ""),
                     new Attribute("FirstName", false, NodeFigure.None, ""),
                     new Attribute("Title", false, NodeFigure.None, ""),
                     new Attribute("TitleOfCourtesy", false, NodeFigure.None, ""),
                     new Attribute("BirthDate", false, NodeFigure.None, ""),
                     new Attribute("HireDate", false, NodeFigure.None, ""),
                     new Attribute("Address", false, NodeFigure.None, ""),
                     new Attribute("City", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Region", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("PostalCode", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("Country", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("HomePhone", false, NodeFigure.None, ""),
                     new Attribute("Extension", false, NodeFigure.None, ""),
                     new Attribute("Photo", false,NodeFigure.None, ""),
                     new Attribute("Notes", false, NodeFigure.None, ""),
                     new Attribute("ReportsTo", false, NodeFigure.None, ""),
                     new Attribute("PhotoPath", false, NodeFigure.None, "") } },
    new Entity() { Key = "EmployeeTerritories",
                   Items=new Attribute[] {
                     new Attribute("EmployeeID", true, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("TerritoryID", true, NodeFigure.Cube1, "LightBlue") } },
    new Entity() { Key = "Order Details",
                   Items=new Attribute[] {
                     new Attribute("OrderID", true ,NodeFigure.None, "Yellow"),
                     new Attribute("ProductID", false, NodeFigure.None, ""),
                     new Attribute("UnitPrice", false, NodeFigure.None, ""),
                     new Attribute("Quantity", false, NodeFigure.Circle, "Pink"), 
                     new Attribute("Discount", false, NodeFigure.Ellipse, "Pink") } },
    new Entity() { Key = "Orders",
                   Items=new Attribute[] {
                     new Attribute("All Columns", false, NodeFigure.AsteriskLine, "Black"),
                     new Attribute("OrderID", true, NodeFigure.None, "Yellow"),
                     new Attribute("CustomerID", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("EmployeeID", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("OrderDate", false, NodeFigure.None, ""),
                     new Attribute("RequiredDate", false, NodeFigure.None, ""),
                     new Attribute("ShippedDate", false, NodeFigure.None, ""),
                     new Attribute("ShipVia", false, NodeFigure.None, ""),
                     new Attribute("ShipName", false, NodeFigure.None, ""),
                     new Attribute("ShipAddress", false, NodeFigure.None, ""),
                     new Attribute("ShipCity", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("ShipRegion", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("ShipPostalCode", false, NodeFigure.Cube1, "LightBlue"),
                     new Attribute("ShipCountry", false, NodeFigure.Cube1, "LightBlue") } },
    new Entity() { Key = "Products",
                   Items=new Attribute[] {
                     new Attribute("ProductID", true, NodeFigure.None, "Yellow"),
                     new Attribute("ProductName", false, NodeFigure.None, ""),
                     new Attribute("SupplierID", false, NodeFigure.None, ""),
                     new Attribute("CategoryID", false, NodeFigure.None, "Blue"),
                     new Attribute("QuantityPerUnit", false, NodeFigure.None, ""),
                     new Attribute("UnitPrice", false, NodeFigure.None, ""),
                     new Attribute("UnitsInStock", false, NodeFigure.None, ""),
                     new Attribute("UnitsOnOrder", false, NodeFigure.None, ""),
                     new Attribute("ReorderLevel", false, NodeFigure.None, "") } },
    new Entity() { Key = "Region",
                   Items=new Attribute[] {
                     new Attribute("RegionID", true, NodeFigure.None, "Yellow"),
                     new Attribute("RegionDescription", false, NodeFigure.None, "") } },
    new Entity() { Key = "Shippers",
                   Items=new Attribute[] {
                     new Attribute("ShipperID", true, NodeFigure.None, "Yellow"),
                     new Attribute("Phone", false, NodeFigure.None, "") } },
    new Entity() { Key = "Territories",
                   Items=new Attribute[] {
                     new Attribute("TerritoryID", true, NodeFigure.None, ""),
                     new Attribute("TerritoryDescription", true, NodeFigure.None, ""),
                     new Attribute("RegionID", false, NodeFigure.None, "") } },
    new Entity() { Key = "Suppliers",
                   Items=new Attribute[] {
                     new Attribute("SupplierID", true, NodeFigure.None, ""),
                     new Attribute("CompanyName", false, NodeFigure.None, ""),
                     new Attribute("ContactName", false, NodeFigure.None, ""),
                     new Attribute("ContactTitle", false, NodeFigure.None, ""),
                     new Attribute("Address", false, NodeFigure.None, ""),
                     new Attribute("City", false, NodeFigure.None, ""),
                     new Attribute("Region", false, NodeFigure.None, ""),
                     new Attribute("PostalCode", false, NodeFigure.None, ""),
                     new Attribute("Country", false, NodeFigure.None, ""),
                     new Attribute("Phone", false, NodeFigure.None, ""),
                     new Attribute("Fax", false, NodeFigure.None, ""),
                     new Attribute("HomePage", false, NodeFigure.None, "") } },
  };

        // define the relationships between the tables
        // Text holds the string for the "From" end; ToText holds the string for the "To" end
        model.LinksSource = new ObservableCollection<Relationship>() {
    new Relationship() { From="Shippers", To="Orders", Text="1", ToText="0..N"},
    new Relationship() { From="Customers", To="Orders", Text="1", ToText="0..N"}, 
    new Relationship() { From="Customers", To="CustomerCustomerDemo", Text="1", ToText="0..N"},
    new Relationship() { From="Orders", To="Order Details", Text="1", ToText="0..N"},
    new Relationship() { From="Categories", To="Products", Text="1", ToText="0..N"},
    new Relationship() { From="Products", To="Order Details", Text="1", ToText="0..N"},
    new Relationship() { From="Suppliers", To="Products", Text="1", ToText="0..N"},
    new Relationship() { From="Employees", To="Orders", Text="1", ToText="0..N"},
    new Relationship() { From="Employees", To="EmployeeTerritories", Text="0..N"},
    new Relationship() { From="Employees2", To="Employees", Text="1", ToText="0..N"},
    new Relationship() { From="CustomerDemographics", To="CustomerCustomerDemo", Text="1", ToText="0..N"},
    new Relationship() { From="Territories", To="EmployeeTerritories", Text="1", ToText="0..N"},
    new Relationship() { From="Region", To="Territories", Text="1", ToText="0..N"},      };

        model.HasUndoManager = true;
        myDiagram.Model = model;
    }

walter · October 29, 2009, 5:01pm

We’ll see if we can improve the performance.

FYI, I copied the code into GoWpfDemo, and the performance was quite reasonable. That implies that the problem has to do with either Silverlight itself or with GoSilverlight’s Silverlight-specific code.

(Also FYI: System.Windows.Media.BrushConverter didn’t like empty strings for colors; in the future GoWpf’s StringBrushConverter will return a transparent Brush.)

walter · October 30, 2009, 12:10pm

Well, I’ve found one optimization that helps. It helps GoWpf too.

Rich_Harrigan · October 30, 2009, 6:04pm

Hi Walter,

That was quick. Imagine what you can do in the fullness of time. I would like to try it out if possible. If it’s not possible I completely understand, I can wait for release 1.0.

Thanks
Rich

emtopping · November 10, 2009, 2:34pm

Again, I’m emphasising how important it is to specify browser version as well as hardware/os…