This record mapper shows a number of "fields" for each "record" and how they are mapped between each other.

Draw new links by dragging from the background of any field. Reconnect a selected link by dragging its diamond-shaped handle. The "record" Nodes use a Panel.Table to place the various fields into rows. Records are not copyable or deletable.

For a variation on this sample with selectable fields in the record nodes, see the selectable fields sample.

Diagram Model saved in JSON format, automatically updated after each change or undo or redo:

GoJS Features in this sample

Table Panels

The "Table" Panel, Panel.Table, arranges objects in rows and columns. Each object in a Table Panel is put into the cell indexed by the value of GraphObject.row and GraphObject.column. The panel will look at the rows and columns for all of the objects in the panel to determine how many rows and columns the table should have. More information can be found in the GoJS Intro.

Related samples


Item Arrays

It is sometimes useful to display a variable number of elements in a node by data binding to a JavaScript Array. In GoJS, this is simply achieved by binding (or setting) Panel.itemArray. The Panel will create an element in the panel for each value in the Array. More information can be found in the GoJS Intro.

Related samples