Clarity

I was really impressed by gcubed's obs html portlet post (and all of his other work as well). I had been messing around with Mike Bostock's d3js library and decided to try and combine both. I borrowed much of Gene's authentication and document parsing work but rendered the OBS like this: http://bl.ocks.org/mbostock/4339083. Toggle nodes to expand/collapse.

Deployment:

1. I have a single html file containing the required css and js (excluding the d3.js library). I serve it up from a "custom" directory created in my Clarity application's webroot, but chris.wuenstel's knowledge store trick (https://communities.ca.com/thread/116836359) would work too.

2. I do the same thing with the d3.js library (d3.v3.min.js), although you could use a CDN. Available from: http://d3js.org.

3. I use an HTML portlet with an iframe like Gene.

4. There's a simple nsql query (id: x_api_obs). Replace the OBS UNIQUE_NAME value in the WHERE clause with something appropriate.

Areas for Improvment:

While it is somewhat useful for visualizing larger OBSs, on its own it's really just a parlor trick. But I could imagine adding to it to show just about anything. For example, you could show OBS associated security rights for a given user/group/OBS unit.

Going further, it might be nice to build a library/framework to handle the Clarity api access and document parsing. I suppose that you could also abstract pre-built charts on top of d3js similar to http://nvd3.org, but oriented to Clarity.

Caveats:

• Will not work with IE in v13.0 (and maybe v13.1-3). This is due to Clarity forcing IE8 emulation in 13. It does work on IE in v14.1.
• Works on Chrome and later versions of FF in 13, but does not work in older versions of FF and Safari.  I don't understand why, but the XML returned from Clarity is not parsed correctly in these browsers.
• I'm not much of a client side JS developer...

Thanks for sharing this , and a big thanks for "gcubed" to kick it off

NJ

Thanks, that looks great.

Tried that on v13.3 with https, but does not display anything, neither does gcubed's obs html portlet

Replaced the script text with

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>

The preview in both cases display the same static structure.

Even more so with this one need instructions for dummies or complete idiots

1. Does your nsql query return data?

2. What is the ID of your nsql query? Is it x_api_obs? If not, change the value on line 321 of OBSD3.html

3. Are both the html file and ds.js file being downloaded by the browser?  Key F12 should bring up the developer tools for Chrome and IE where you can view the status on the Network tab. Ctrl-Shift-K brings up a console in my version of FF (which is old, YMMV)

4. In the same developer tools, can you see any obvious messages on the Console tab?

Thanks Andrew,

Tried the original by Chris on r8.1 did not work.

Then tried it on v13.3 Sandbox, but had forgot how it went and tried to display the html file which displayed blank.

Then created yours on the same Sandbox and tried to display the html file again.

After you post went back and displayed the portlet. Both display the same and also in the preview.

Using FF 33

Maybe my replace script does not work and can't put the .js files on the Sandbox.

Tried your portlet on V12 where I put the .js files in ..Clarity\webroot\lib, preview hangs.

Tried both portlets on v13.3 on premise with http, nothing in the preview. Will have to go back to that with some more time and can try you instructions 3 and 4. A qrid portlet based on the query brings data without any problems.

Cool stuff. We have it up and working in 13.2 fixpack 4 in Chrome 39. IE 11 notsomuch - will test again come 14.2.

Nice. You might be able to shim it to get it to work in 13.2, but we're upgrading to 14.1 shortly, so I haven't bothered trying.

Thank you Gene (gcubed) and AndrewLerner again for this great information. I am getting a little further with these, but still can't display hem at will.

I've established that if I do not have access to the file system to put the js files there and there is no connection to the outside internet from the server to access the web site where they are putting them in the Knowledgebase as suggested works just fine. But there is something more to it and I can't get what that is.

I set them up on a system and the work just fine. But on another system they do not work all I get is

If that were retrieving data the circle would be filled with blue when not expanded.

Here the same thing the chart orientation displays options and works but it is not getting the data from the query

For both a grid portlet using the same queries return the data without problems.

What am I still missing?

Hmmm...

1. does the nsql query specified on line 321 of the OBSD3.html file exist in this environment?

2. If so, does the OBS specified in the WHERE clause of the nsql query exist in this environment?

Thanks, that would make sense. I'll check that tomorrow on site.

The thing is that I successfully created those on my VM and tried to create everything exactly the same on the physical system while having the VM on another display.

The answer to both questions is Yes.

As I posted a grid portlet using the query returns data without problems.

What browser are you using?

I used FF 41.02 until the alert came out. Have not tried with anything else since then.

Can you check two things?

1. Make sure that all the required resources are loaded in the browser

• In FF, Select Tools > Web Developer > Network (this might be slightly different on Windows, but it should be obvious what it is)
• Reload the page
• Check that there are no 404 or 500 errors for items like d3.js, OBSD3.html or the XOG call. Everything should be 200 or 304

2. Check for any javascript errors

• In FF, Select Tools > Web Developer > Web Console
• Reload the page
• Check for any horrible looking errors. You might see a few warnings, which are OK.

Thank you for your effort.

Those two things just appear to be loading and do not finish.

C:\ >java -version

java version "1.7.0_67"

Java(TM) SE Runtime Environment (build 1.7.0_67-b01)

Java HotSpot(TM) Client VM (build 24.65-b04, mixed mode, sharing)

Is that saying that having the js file in Knowledgebase is not working the way it is supposed to work.?

I'm not sure about the The character encoding of a framed document was not... bit. The other messages are OK.

What happens if you open another tab with the html file alone? That is to say if your html portlet iframe source is /niku/custom/obs/OBSD3.html, use http://<yourserver>/niku/custom/obs/OBSD3.html as the address.

This is what I get, but I get that also on the system where the portlet works.

Why might that be

Got a little bit furhter with this.

On my VM where it works the address to the OBSDS3.html document is ..localhost...

That of course works only on the server, but not from clients.

The live system where it does not work from a client is a cluster with a load balancer which apparently has something with it to do.

For one if I ping the server name I do get an IP but no reply.

So I think that everything is set up correctly, but the access is configured so that the portlet is not displayed.

I think the best way to solve that is to sweet talk to the guy who can but the required files in the web root.

THanks for your support.

Thanks for sharing, it's awesome

Would love to see if this could deliver something like a project structure chart or portlet.
Some of our clients in the engineering or manufacturing space still use this view to discuss projects among stakeholders:

I think that could be doable.

For OBS the NSQ used is
SELECT           @SELECT:DIM:USER_DEF:IMPLIED:OBS:ID:ID@,
                          @SELECT:DIM_PROP:USER_DEF:IMPLIED:OBS:UNIQUE_NAME:UNIQUE_NAME@,
                          @SELECT:DIM_PROP:USER_DEF:IMPLIED:OBS:PARENT_ID:PARENT_ID@,
                          @SELECT:DIM_PROP:USER_DEF:IMPLIED:OBS:NAME:NAME@
FROM             PRJ_OBS_UNITS

which basically the unit and its parent coming from the PRJ_OBS_UNITS table i

while for tasks there is no consistent parent_id but it has to be configured from

and

A developer with adequate imagination could do that in a complex query or it could stored in a view as it must be calculated on the fly because the user and the system can change the WBS sorting.

(Ability to extract OBS structure into a diagram )