Data Source Binding

> > > > >

If a project is not already set and you want to set a data source to a diagram, a data source component should be connected to the diagram.

Using an XML File

An easy way to connect to a data source is to use an XML file in diagram format.

<jvdf:diagrammerView id="diagrammer" data="data/molecule.xml"/>

Note

If your XML file is not in diagram format, you can use the XMLDataSource component to specify an XSLT file.

Using a Value Binding

Another way to specify a data source is to use a value binding. In this case, the data model is provided by a bean property:

<jvdf:diagrammerView [...] data="#{diagrammerBean.dataSource}" />

The bean should then provide the data model through its getDataSource method:

  public IlvDiagrammerDataSource getDataSource() {
    if (dataSource == null)
        dataSource = createDataSource();
    return dataSource;
  }

Note

The JViews Diagrammer JSF component properties are all bindable.

To use the value binding attribute, the bean must be declared in the faces-config.xml file or the managed-beans.xml :

<faces-config>
  <managed-bean>
    <description>A diagram component demo bean</description>
    <managed-bean-name>diagrammerBean</managed-bean-name>
    <managed-bean-class>diagrammerBean</managed-bean-class>
    <managed-bean-scope>session</managed-bean-scope>
  </managed-bean>
</faces-config>

For further information about these configuration files, see the http://java.sun.com/j2ee/javaserverfaces/reference/index.htmlJavaServer Faces specifications.

DataSource and XMLDataSource Components

Another way of setting a data source to a diagram view is to use the dataSource and XMLDataSource components. These components allow you to create and configure a data source. The data source is stored in memory and is ready to be set on a diagram component.

Setting a data source on a diagram component

<jvdf:XMLDataSource filename="data/molecule.xml" id="xmlDataSource" />

<jvdf:dataSource value="#{diagrammerBean.datasource}" />

<jvdf:diagrammerView id="diagrammer" data="xmlDataSource" [...] />

<h:commandButton type="button" value="Set XML Data Source"
 onclick="diagrammer.setDataSourceId(‘xmlDataSource’)" />

<h:commandButton type="button" value="Set Bound Data Source"
 onclick="diagrammer.setDataSourceId(‘dataSource’)" />

This example creates two data sources: one filled from an XML file and another one from a bound diagram data source.

The two data sources are present in memory. It is then possible to query the server for switching the data source and updating the image without a complete page refresh by clicking one of the command buttons. To perform this task, use the client-side JavaScript proxy of the diagram view.

The initial data source of the diagram view is configured through the data tag attribute that must match the id attribute of the desired data source component.

To learn how to use these proxies, see JavaScript objects.

The diagrammer property allows you to bind an existing IlvDiagrammer instance to be reused by the diagrammerView component.

<jvdf:diagrammerView [...] diagrammer="#{diagrammerBean.diagrammer}" />

Current section

The JViews Maps JSF component set