Dive_demo does not display any grid while Overview_demo works fine

[Imane0]

I executed the provided notebooks facet_overview and facets_dive on my own dataset on Google Chrome browser.

facets_overview works as expected (interactive output, all statistics, all options for Chart and Sort by, etc...).

However facets_dive outputs no grid at all. See image below.

With Ctrl-Shift-i in the browser where my notebook is open, I can read the following errors (cf right bottom corner in the above image, written in red):

Uncaught TypeError: Cannot read property 'findSprites' of undefined
    at a.clicked (facets-jupyter.html:7063)
    at SVGSVGElement.<anonymous> (facets-jupyter.html:169)
facets-jupyter.html:7066 Uncaught TypeError: Cannot read property 'width' of undefined
    at a.fitToViewport (facets-jupyter.html:7066)
    at HTMLElement.fitToViewport (facets-jupyter.html:7120)
    at HTMLElement.a.fitButton.onclick (facets-jupyter.html:8155)
2facets-jupyter.html:7063 Uncaught TypeError: Cannot read property 'findSprites' of undefined
    at a.clicked (facets-jupyter.html:7063)
    at SVGSVGElement.<anonymous> (facets-jupyter.html:169)

How can I solve this problem and make Dive output a grid ?

[Imane0]

I have the same output even when I open the notebook with jupyter notebook --NotebookApp.iopub_data_rate_limit=10000000 notebook.ipynb

I further noticed when scrolling up the Console that I have the following errors also:

Failed to load resource: the server responded with a status of 404 (Not Found)
Failed to load extension: Array(1) Error: Script error for "nbextensions/facets-dist/"
http://requirejs.org/docs/errors.html#scripterror
    at makeError (require.js:165)
    at HTMLScriptElement.onScriptError (require.js:1732)

The demos in https://pair-code.github.io/facets/, both Overview and Dive, work as expected.

[jameswex]

can you try changing you notebook's HTML_TEMPLATE to pull facets dive from github as opposed to your locally installed facets dive dist HTML? Use this link tag in your html template and let me know if that changes anything. Thanks.

[livington]

I'd had the same error, I was trying to use facets dive from local machine and from github repo too.

[MarineN1]

I have the same issue, how to fix this problem ? Thanks

[jimbojw]

I'm not sure, but it seems like there could be different causes that have the same symptoms. @Imane0 's original post said that the Demo page worked fine.

@livington and @MarineN1 , does the demo page work for you? Or does that also exhibit the problem? https://pair-code.github.io/facets/

[MarineN1]

Yes, in fact, contrary to @Imane0, the demo page doesn't work for me, I have the same display problem as @livington.

[jimbojw]

@MarineN1 Ok thanks, can you try this THREE.js demo page too? https://threejs.org/examples/#webgl_animation_cloth

[MarineN1]

The THREE.js demo page works, I see the animations. Furthermore as @Imane0 facets_overview works as expected with interactive output

[MarineN1]

I have just the problem with facets_dive

[MarineN1]

No solution to fix the problem with facets_dive? Thanks