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 value binding
Another way to specify a data source is to
use a value binding. In this case, the data model will be
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://http://java.sun.com/j2ee/javaserverfaces/reference/index.html
JavaServer™ 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’)" />
In this example, we create 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, we 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.
See JavaScript objects to learn how to use
these proxies.
The
diagrammer
property allows you to bind an existing IlvDiagrammer instance to be reused by the
diagrammerView
component.
<jvdf:diagrammerView [...] diagrammer="#{diagrammerBean.diagrammer}" />