The following are the new D3.js visualizations being added to 8201 as WF Extensions.

Surprised to see Data Tables in the list.

Arc
Calendar
Cartogram
Chord
Cluster
Datatables
liquid Gauge
Org chart
Sankey
Sunburst
Timeline


https://github.com/ibi/wf-extensions-chart

It would be interesting to see whether IBI can create a market place for these plugins where any user can create his own d3 visualizations as a extension and share with the community.

This message has been edited. Last edited by: FP Mod Chuck,

That is very interesting.

We are using datatables here with some reports.

I wonder if its all of it or just a component.

Hi Tomatosauce

The beauty about D3 is that even though there are some provided as you have documented but you can add any D3 chart to use. You are not limited to the ones provided. Below is a helpful link that explains how to add your own.

https://github.com/ibi/wf-extensions-chart/wiki

In additon Focal Point is the perfect place to advertise D3 charts you have enabled

Happy day!

Great to see DataTables.js being used by so many now, and that IBI is officially supporting it as an extension that will be compatible with WebFOCUS moving forward.

A royal Git'R Done!! is deserved! Pass the bubbly! ;-)

Thanks for letting us all know tomatosauce!

Hi,

can we use D3.js Extension in WF81 series?

quote:

Originally posted by Neelima:
Hi,

can we use D3.js Extension in WF81 series?

No Neelima, These extensions are currently limited to WF8200 and Above

Are they all working for you folks? Some of them aren't working for me. DataTables for example throws up errors even if I'm not using it (I've enabled via the JSON file, but that's all).

What kind of error does it throw? What GEN are you running?

I have this working.

-*Do not delete or modify the comments above
ENGINE INT CACHE SET ON


-DEFAULTH &WF_STYLE_UNITS='PIXELS';
-DEFAULTH &WF_STYLE_HEIGHT='405.0';
-DEFAULTH &WF_STYLE_WIDTH='770.0';

-DEFAULTH &WF_TITLE='WebFOCUS Report';
GRAPH FILE ibisamp/car
-* Created by Info Assist for Graph
SUM CAR.BODY.SALES
BY CAR.ORIGIN.COUNTRY
BY CAR.COMP.CAR
BY CAR.CARREC.MODEL
ON GRAPH PCHOLD FORMAT JSCHART
ON GRAPH SET HTMLENCODE ON
ON GRAPH SET GRAPHDEFAULT OFF
ON GRAPH SET ARGRAPHENGIN JSCHART
ON GRAPH SET EMBEDHEADING ON
ON GRAPH SET VZERO OFF
ON GRAPH SET UNITS &WF_STYLE_UNITS
ON GRAPH SET HAXIS &WF_STYLE_WIDTH
ON GRAPH SET VAXIS &WF_STYLE_HEIGHT
ON GRAPH SET LOOKGRAPH EXTENSION
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_SCRIPT

setPieDepth(0);
setPieTilt(0);
setDepthRadius(0); 
setCurveFitEquationDisplay(false); 
setPlace(true); 

*END
INCLUDE=IBFS:/FILE/IBI_HTML_DIR/ibi_themes/Warm.sty,$
TYPE=REPORT, TITLETEXT=&WF_TITLE.QUOTEDSTRING, ORIENTATION=LANDSCAPE, $
TYPE=DATA, COLUMN=N1, BUCKET= >row, $
TYPE=DATA, COLUMN=N2, BUCKET= >row, $
TYPE=DATA, COLUMN=N3, BUCKET= >row, $
TYPE=DATA, COLUMN=N4, BUCKET= >measure, $
*GRAPH_SCRIPT

setReportParsingErrors(false);
setSelectionEnableMove(false);
*GRAPH_JS_FINAL
"pieProperties": {
"holeSize": "0%"
},
"chartType": "com.ibi.datatables",
"agnosticSettings": {
"chartTypeFullName": "com.ibi.datatables"
}

*END
ENDSTYLE
END

-RUN

Thanks for the reply... I copied that text into a new procedure and ran it.

The datatable displayed for a split second, and then was immediately replaced with the following text:

ERROR
----------
TypeError: Object doesn't support property or method 'renderComplete'

If I hit F12 in IE11, the console says:

SCRIPT5007: Unable to get property 'style' of undefined or null reference
File: datatables.min.js, Line: 80, Column: 196

Have any of you had to mess around with the JS files to make these work?

I tried removing that stylesheet (commented out that INCLUDE statement), but I still get the same result.

I also tried creating a datatables report using cars.mas, and right after I select datatables I get a script error window in AppStudio:

Line: 370
Char: 3
Error: Object doesn't support property or method 'renderComplete'
Code: 0
URL: http://devibi/ibi_apps/webcons...om.ibi.datatables.js

This message has been edited. Last edited by: Shingles,

It seems to work in Chrome but not in IE. I got the same error in IE11.

Oh...

So how do you folks deal with that? Do your clients/users only use Chrome?

I just tested this in Edge and it works. Most shops I've worked with allow Firefox or Chrome. If that's not available, usually Microsoft Edge is on the machine. See if that works and suggest they use Edge instead of IE.

Hmmm... alright... thank you.

I can run it fine within WF 8.2.01M using IE version 11.0.9600.17728.

T

Just for information, it is worth returning to GitHub if you experience problems with an extension to see if the issue has been reported and whether a fix is available.

For instance, I was experiencing data duplication on resize of a window when using DataTables. This was fixed in May 2017 and downloading the latest version, clearing the cache using Admin console and also browser cache, fixed the problem.

I would recommend that you make a temporary backup of the extension(s) before overwriting with a new download. Just in case ....

T

I second Tony A to return to GitHub and investigate via the Issues tab. I add that if there isn't an issue for said found bug, please submit an issue with anything you can give that will make the bug reproducible if possible. I submitted the issue on what Tony found with the resize way back in May, and within the next few days the developer had a fix in place. GIT R DONE!

I opened a ticket with the IBI folks.

How to use accordion in the data tables chart

Siva1925,

The extension used here is based on a JavaScript library known as DataTables.js; and can be found here: http://www.datatables.net

Upon searching therein, you'll find the following:

https://datatables.net/examples/api/row_details.html

This message has been edited. Last edited by: CoolGuy,