This tutorial explains how to set up and test the custom web visualization SDK example for Spotfire 3.0-3.3.
Overview
The SDK provides a set of fully functional web visualizations. This step-by-step instructions detail the required procedures. These the custom web visualization make up a good starting point for building new custom visualizations.
Background Information
- Creating a Visualization
A visualization is a visual displaying data in Spotfire. A custom visualization defines a unique visualization, implementing model, view, and possibly using additional components.
- How to Create a Visualization Model
A visualization model manages the state of a visualization. It is also expected to be capable of drawing itself.
- How to Create a Visualization View
A visualization view handles user input and is responsible for drawing the visualization in the user interface.
- How to Create a Visualization Web View
To display a custom Spotfire visualization in the Web Player, implement a custom web control. It must be integrated with the model object of the visualization to communicate state change and receive updates
Prerequisites
Spotfire SDK\Examples\Extensions\
+ SpotfireDeveloper.CustomVisualsExampleWeb
+ SpotfireDeveloper.CustomVisualsExample
+ SpotfireDeveloper.CalculationMethodExample: This project is required by the Normal Plot to run both in Spotfire and the Web Player. It is a shortcut visualization, a configured scatter plot with axis expressions containing CenteredRank, an expression defined in the SpotfireDeveloper.CalculationMethodExample.
When debugging the project, verify the following custom web visualization features:
- The Custom Scatter Plot handles marking.

- The Web Details plot reacts to changes in marked rows, performing searches.

- The Traffic Light reacts to filtering.
If no useful expression and limit have been set, no filtered rows should result in no color:

- The Histogram displays filtered and marked rows. It is part of the SpotfireDeveloper.CustomVisualization project but it is not a custom plot. It is a shortcut visualization. It configures a bar chart to display as a histogram:
- The Normal Plot reacts to both marking and filtering. It embeds a scatter plot with a predefined X axis expression in the source code. The expression defines the normal plot behavior. Note that it does not follow the custom visualization pattern, but instead implements a custom node to extend the document.
- Extending the Document
The document model is a node tree. It is extended by adding new nodes.
- Document Nodes
DocumentNode is the abstract base class for all types in the model. The document is extended by creating, attaching and configuring nodes.
Building the Extensions
- In Visual Studio®, open the project
SpotfireDeveloper.CustomVisualsExampleWeb.
- Add the
SpotfireDeveloper.CustomVisualsExample and SpotfireDeveloper.CalculationMethodExample projects.
- Verify that the references in all projects correct point at the
SDK\Binaries assemblies.
- In the
SpotfireDeveloper.CustomVisualsExampleWeb project, make sure there is a reference to the SpotfireDeveloper.CustomVisualsExample project.
- Build the solution.
There should be no errors or warnings.
Testing the Custom Web Visualizations
- In Spotfire, create an analysis containing custom visualizations.
- Save the analysis to the Spotfire library as
CustomAnalysis.
- Install Spotfire Web Player.
- Open a web browser and enter the URL to the Spotfire Web Player.
- Open
CustomAnalysis from the Spotfire Library. The custom visualizations should be rendered as white boxes with the text: This visualization is not supported in TIBCO Spotfire Web Player..
- Add the custom visualizations to the TIBCO Spotfire Web Player installation:
- Use Package Builder to deploy packages for
SpotfireDeveloper.CalculationMethodExample and SpotfireDeveloper.CustomVisualsExampleWeb to the Web Player. Note that the intended client should be set to TIBCO Spotfire Web Player. Also make sure that SpotfireDeveloper.CustomVisualsExample.dll is included in the SpotfireDeveloper.CustomVisualsExampleWeb package.
- Update the Web Player to install the new packages. Read the Web Player installation manual for details on how to do this.
- In the Spotfire Web Player, open
CustomAnalysis from the library. Verify that the following custom web visualization features:
- The Normal Plot reacts to both marking and filtering.
- The Custom Scatter Plot handles marking.
- The Web Details plot reacts to changes in marked rows, performing searches.
- The Traffic Light reacts to filtering.
If no useful expression and limit have been set, no filtered rows should result in no color.