Problem with setting shape position (X,Y) with data binding

[Stefan]

Hello,

I have problem with setting custom position of rectangle shapes on the diagram using server-side data binding with SQL DataSource.

these are diagram settings:

<telerik:RadDiagram ID="brackets" runat="server" Width="100%" Height="450" BorderWidth="1" BorderColor="#dddddd" DataSourceId="IntegratedDiagramDS" ConnectionDataSourceId="IntegrationDiagramsConnDS"                               OnItemDataBound="brackets_ItemDataBound" EnableViewState="false">
<ClientEvents OnLoad="diagram_load" OnMouseEnter="mouseEnter" OnClick="OnShapeClick" />
<ConnectionDefaultsSettings Editable="false" Selectable="false"></ConnectionDefaultsSettings>
<ShapeDefaultsSettings Editable="false" Selectable="false" Height="40" Width="160">
    <StrokeSettings Width="2" />
</ShapeDefaultsSettings>
<BindingSettings>
     <ShapeSettings
                DataFillColorField="BCGColor"
                DataStrokeColorField="BorderColor"
                DataContentTextField="IntegratedObject"
                DataIdField="FieldTableID"
                DataXField="XVal"
                DataYField="YVal"/>
     <ConnectionSettings
                 DataFromShapeIdField="RelatedID"
                 DataToShapeIdField="FieldTableID"/>
</BindingSettings>
</telerik:RadDiagram>

 

There are no problems with displaying and connections, everything is working fine. since I want to display diagram shapes on custom position (not randomly) I've set DataXField and DataYField to set specific position for each shape, but as a result I have same display as if those attributes are not set. It looks like they are somehow ignored.

Attached files:

• sample data from DB - samledata.png
• what I get as a result - defaultPreview.png
  
  • position on page source - defaultXYValues. As You can see these are default values, starting from position 50,50...

Can someone advice what I'm doing wrong?

Thanks in advance,

Stefan

[Peter Milchev]

Hello Stefan,

Most probably somewhere in the item data bound event the values are changed as using the same approach, I get the correct positioning:

<telerik:RadDiagram ID="RadDiagram1" runat="server">
    <BindingSettings>
        <ShapeSettings DataContentTextField="text" DataIdField="id" DataTypeField="type"
            DataXField="x" DataYField="y" />
        <ConnectionSettings
            DataFromShapeIdField="RelatedID"
            DataToShapeIdField="FieldTableID" />
    </BindingSettings>
    <ShapeDefaultsSettings Editable="false" Selectable="false" Height="40" Width="160">
        <StrokeSettings Width="2" />
    </ShapeDefaultsSettings>
</telerik:RadDiagram>

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        RadDiagram1.DataSource = GetShapes();
        RadDiagram1.ConnectionDataSource = GetConnections();
        RadDiagram1.DataBind();
    }
}

private IEnumerable GetShapes()
{
    return new[] {
        new {id="Shape1", text="Shape 1", type="rectangle", x=400, y=140, width=300, height=100},
        new {id="Shape2", text="Shape 2", type="rectangle", x=11, y=10, width=200, height=200},
        new {id="Shape3", text="Shape 3", type="rectangle", x=205, y=10, width=300, height=100},
        new {id="Shape4", text="Shape 4", type="rectangle", x=595, y=10, width=200, height=200},
        new {id="Shape5", text="Shape 5", type="rectangle", x=790, y=10, width=300, height=100},
        new {id="Shape6", text="Shape 6", type="rectangle", x=205, y=270, width=300, height=100},
        new {id="Shape7", text="Shape 7", type="rectangle", x=400, y=270, width=300, height=100},
        new {id="Shape8", text="Shape 8", type="rectangle", x=595, y=270, width=300, height=100},
    };
}
private IEnumerable GetConnections()
{
    return new[] {
        //new {FieldTableID="Shape1",RelatedID="Shape1"},
        new {FieldTableID="Shape2",RelatedID="Shape1" } ,
        new {FieldTableID="Shape3",RelatedID="Shape1"},
        new {FieldTableID="Shape4",RelatedID="Shape1" },
        new {FieldTableID="Shape5",RelatedID="Shape1" },
        new {FieldTableID="Shape6",RelatedID="Shape1"},
        new {FieldTableID="Shape7",RelatedID="Shape1"},
        new {FieldTableID="Shape8",RelatedID="Shape1"}
    };
}

 

Regards,
Peter Milchev
Progress Telerik