JavaScript Visualization Framework - JSViz and TIBCO Spotfire®
Important Announcement
As of Spotfire 11.0, the core product now features visualization mods that overlaps to a large degree with JSViz. More on this here:
Users upgrading to or installing Spotfire 7.12 or later will need to download and install the latest version of JSViz. See the "Known Issues" section for more details.
Introduction
Within the TIBCO Spotfire® community, one area of discussion that crops up continually is that of new visualization types. Customers often ask for a visualization type during a POC that Spotfire does not currently support. Others ask for simple customizations of existing visualizations, such as moving labels around, that sound straightforward but are almost impossible to implement without extensive coding.
There are now a number of JavaScript libraries available for creating rich interactive graphics within a standard web browser. One such is D3 which has a large library of example visualizations available on the D3 Website. There are many others, including Highcharts, ZoomCharts and Google Charts.
The JavaScript Visualization Framework, or JSViz, is a Custom Extension for TIBCO Spotfire that allows users to create their own visualizations using JavaScript libraries such as d3 but still allow them to seamlessly integrate with the Spotfire platform. Note that although d3 was an initial driver for implementing the custom extension, it can actually work with any JavaScript based code.
Samples
Included with the framework are a number of sample charts including:
- Doughnut Chart
- Circle Packing
- Chord Diagram
- Gauges
- Area Chart
- Horizon Chart
- Polar Chart
- Ternary Chart
- Tree Control
- Venn Diagram
- Word Cloud
- other examples:
Partner Samples
A TIBCO Partner, IQVIA have produced a number of high quality samples that use a framework built on top of JSViz. You can find them here.
The samples include:
- Animating Data
- Bullet List
- Gauges and Donuts
- Image Viewer
- Network Chart
- Radar (Spider) Chart
- Sankey Chart
- Word Cloud
Download JSViz - Versions
JSViz can be downloaded from the TIBCO Exchange.
JSViz is compatible with Spotfire 7.5 and later.
For an overview of the different extension and customization options that the Spotfire platform provides, see Extending TIBCO Spotfire.
API
The documentation for the .NET API is attached below as a zip file. This API can be used within Spotfire via IronPython or within a .NET Spotfire Custom Extension to configure JSViz visualizations.
The examples provided with JSViz also include a comprehensive scripting example showing how to use IronPython to create and configure JSViz charts.
Automating Plot Setup
It is possible to automate the creation of JSViz instances from the tool bar or the tools menu, by creating a custom extension that leverages the JSViz API:
- One-click JSViz Visualizations - Extending JSViz for TIBCO Spotfire®
- Automating Plot Setup for JSViz Using a Custom Tool in TIBCO Spotfire®
Custom windows forms property pages are now available from 3.5. Developers who have made use of the one-click visualisation extension of pre 3.5 may need to update their add-in project to actively include any of the original property pages of JSViz property dialog as they no longer are displayed by default.
Articles on TIBCO Community
There are a number of articles on TIBCO Community that describe using JSViz to create different types of custom visualizations and other solutions:
https://community.tibco.com/wiki/displaying-terr-graphics-tibco-spotfire-using-jsviz
https://community.tibco.com/wiki/tibco-spotfire-funnel-chart-using-jsviz
Help and Support
Please note that JSViz is not supported through support.tibco.com. In the event of issues or to get help, please post questions in the TIBCO Community Forum here:
https://community.tibco.com/answers
Make sure that you add the tag "JSViz" so that it will be visible.
Licensing
JSViz is shared with the TIBCO Community for free use by customers and partners under the TIBCO Component Exchange License.
Known Issues
-
Under certain circumstances, JSViz may throw the following error when opening a DXP file:
-
InvalidOperationException at Spotfire.Dxp.Framework:
Attempt to read from a node that is in state 'Detached'. (HRESULT: 80131509) -
This issue is resolved in JSViz 3.5.2
-
-
When using IronPython Scripting and setting "Limit by Expression" using the FilterExpression property, in some cases, the expression was not being correctly applied.
-
There is a known issue with JSViz 3.4.0.13 occasionally showing incorrect results when using a Limit By Expression statement. This will be addressed in the next release.
-
JSViz 3.4.0.12 will cause Spotfire to crash if an invalid data configuration is created. Examples of invalid configurations include:
-
Removing all Column Expressions in a group-by configuration
-
Adding a non-aggregated Column Expression in a group-by configuration
-
These issues are fixed in JSViz 3.4.0.13.
-
-
JSViz 3.4.0.13 or above is required when upgrading to or installing Spotfire 7.12 or later. This is due to a clash in versions of log4net.dll between JSViz and Spotfire. Versions of JSViz above 3.4.0.12 remove any dependancy on log4net.dll.
-
Some users may encounter a problem when using JSViz with Spotfire 7.6. This is only an issue with older releases of JSViz, 3.4.0.2 and older. For detailed instructions see the following page: https://community.tibco.com/wiki/jsviz-problems-spotfire-76. Spotfire 7.6 Hotfix 3 is also required.
-
JSViz visuals will work in Web Player and Automation Services as well as Spotfire Analyst (Professional). Make sure to follow the installation instructions in the documentation. Many people forget to update the Web Player after installing the plugin files.
-
There is an issue with the 3.4.0.8 build recently posted. Please download and use a later version.
-
There is an issue with the resize logic in the doughnutchart.dxp sample which may cause the chart to occasionally appear empty when first opening the dxp file. An updated version of the JSViz.js javascript file that resolves this issue can be downloaded from here.
-
JSViz is not supported on Spotfire Desktop (not to be confused with Spotfire Analyst).
Simpler JS, Brunel
Brunel is an open source Domain Specific Language designed specifically for interactive data visualisation. It allows coding complex Javascript D3 visualisations with as little as one line of code. Brunel can be integrated into Spotfire Javascript visualisations.
Attachments
| Attachment | Size |
|---|---|
 jsviz_javascript_visualization_framework_for_tibco_spotfire_3.5.4.0_license.txt | 46.56 KB |
| release_notes.txt | 9.17 KB |
 jsviz-api-docs.zip | 934.21 KB |
Feedback (13)
Found it, thanks Dave! For anyone that might experience the similar issue, the DLLs can be found under [Spotfire Installation]/Modules folder.
The instructions in the section "Setting up Visual Studio" of the article describe in detail the steps required to obtain those dll's.
Hi Dave, Thank you very much for the quick response. By DLL, I was referring to this article: https://community.tibco.com/wiki/one-click-jsviz-visualizations-extending-jsviz-tibco-spotfire which includes a C# VisualStudio sample project. I downloaded it and found that it uses the following namespaces:
I believe these namespaces are from the following two DLLs which can't be found in the regular Spotfire C# SDK zip file or the JSViz release zip file.
Could you please help find these dlls? Thank you!
Sorry about that. It looks like public access to that S3 bucket has been removed. I have attached the zip file for the API documentation to the article. Unzip it onto your hard drive and you should be able to navigate the documentation starting with the index.html file.
I don't understand what you mean by DLL. When JSViz is installed on your Spotfire installation, everything needed to use the API is already there. You can open the sample DXP file "scripting.dxp" to see how things are done. There is also a section in the User Guide explaining how the scripting works.
The .NET API link (link below) is invalid when I click it, can you update it? And where to download its DLL? It's not in the JSViz 3.5.4 release zip file.
https://s3-us-west-2.amazonaws.com/jsviz/docs/html/index.html
Hi w.li ,
There is currently no decision made on if, or when, JSViz would be "deprecated". However, mods is definitely the future of adding new visualizations to Spotfire, and we encourage all new development as such to transition to mods instead of JSViz.
There are still a couple of edge cases where JSViz provides additional options, but the streaming, externall data, and support for native Spotfire UI components makes an overwhelmingly compelling case for using mods.
Will JSViz be deprecated in the near future because mod is available OOTB since v11?
And until when will JSViz still be maintenanced and commnity-supported?
Thanks.
Hi Raina, I have added an updated version of Virtual Table that responds to marking to your Answer page: https://community.tibco.com/questions/my-jsviz-virtual-table-does-not-show-marked-data
I am using the virtual table in my dxp- I want to be able to show marked data when I highlight another visualization. How do I trigger the virtual table to refresh to show marked data everytime I mark new data on a visualization?
Hi Dave, any chance you can add a link to my page? I've released a set of easy to use visuals built on top of JSViz, including features like marking. The full details are here: https://community.tibco.com/wiki/simple-use-jsviz-visualisations-gaugedonut-network-radarspider-sankey-animation-word-cloud
TIBCO Community Wiki page Feedback Policy.
This is one of those cases where editing of JSViz.js is required. The default marking behavior works for 99% of the cases but there are others that we can't predict.
It was always the intention that JSViz.js would be modified by some users.
There's a bug in the latest version - you cannot interact with html <SELECT>
This is because the marking rectangle supercedes the click event to expand the select list.
There is also no way I can see to turn the marking rectangle off, short of manipulating the JSViz.js code itself... Can I suggest this is configurable? Better still, configurable to a viewport rather than the whole body tag?