Convert a custom web visualization to the CustomVisualView API (Spotfire® 7.5)

Introduction

A new unified view API for custom visuals, CustomVisualView, was introduced in TIBCO Spotfire® 7.5. There are a number of steps you must follow to convert a custom web visualization to the CustomVisualView API.

See also

• Create a custom visualization - tutorial

Converting a C# web visualization

1. Implement an extension of CustomVisualView.
2. Register the CustomVisualView implementation in the core visualization add-in class. For example:
    

   protected override void RegisterViews(ViewRegistrar registrar)
   {
       base.RegisterViews(registrar);
       registrar.Register(typeof(CustomVisualView),  
                          typeof(JSVisualizationModel), 
                          typeof(VisualView));
   }

    

   For more information, see RegisterViews.

3. Implement an extension for the method GetResourceCore.
   GetResourceCore provides base html and base JavaScript resources for the visualization.

4. Implement logic for updating the visualization from Spotfire using the method OnUpdateRequiredCore.
   For example:

   protected override void OnUpdateRequiredCore()
   {
       this.InvokeClientEventHandler("render", null);
   }

    

   where "render" is the name of the JavaScript event to be triggered when rendering is needed. Typically, the method will ask the plot for data first, and then show the results.

5. Convert all calls from the old aspx page class into the new CustomVisualView. Essentially, you must convert the reading of an html request to receiving the name and arguments of the methods called.

   1. The ReadCore method is used to read information out of the model (typically, the data for the visualization).

   2. The ModifyCore method is used to modify the state of the document (for example, marking, highlighting, property changes or anything else that modifies the document).

Converting a JavaScript web visualization

1. Convert the JavaScript in the visualization's call to Spotfire. 

   For example, convert from an XmlHttp request to a call to the Spotfire object with a name for the function requested:

   From

    XmlHttp.post(window.location.href, markArgs,CustomVisualization.update);

    

   to

    Spotfire.modify("Mark", markingArgs);

    

   And, in an example for reading operations:

   From

   var values = { data: 'data' }; // just request "data"  
       	XmlHttp.post(window.location.href, values, parseData);

    

   to

    Spotfire.read("Data", {}, function(data){?});

    
2. Possibly, you may need to re-implement your marking implementation. This is because the old custom visuals examples Rectangle.js and RectangleOverlay.js are no longer applicable. Use the SDK exampleCustomScatterPlot as reference.
    
3. Add an event handler for the new SpotfireLoaded event. This event handler should do essentially the same thing that the old CustomVisualization.update callback did, for the old web visualization API.