CermakM / jupyter-require

Jupyter nbextension for JavaScript execution and AMD dependency management.
MIT License
21 stars 7 forks source link

Fails on dagre-d3 #1

Closed Benjamin-Lee closed 5 years ago

Benjamin-Lee commented 5 years ago

I'm trying to use this to display dagre-d3 directed graphs in Jupyter. However, despite declaring it as a requirement, it won't render with Jupyter-require. Here's a gist with a notebook to reproduce the issue as well as the logs that were printed to my console during execution.

CermakM commented 5 years ago

Hello @Benjamin-Lee!

Thanks for reporting the issue and the detailed reproducer. I am gonna go ahead and see if I can reproduce it myself. Can you provide the version of jupyter-require you were using?

Thanks!

CermakM commented 5 years ago

This is not an issue in jupyter-require, it's the code.

So, first of all, I got an error when using the provided CDN, so I used a different config:

require.config(
    paths={
        'd3': 'https://d3js.org/d3.v5.min',
        'dagre-d3': "https://cdnjs.cloudflare.com/ajax/libs/dagre-d3/0.6.3/dagre-d3"
    },
    shim={
        'dagre-d3': { 'deps': 'd3' }
})

And then I just rendered the graph like that:

%%requirejs d3 dagre-d3

const dagreD3 = require("dagre-d3")

// Create the input graph
%%requirejs d3 dagre-d3

const dagreD3 = require("dagre-d3")

// Create the input graph
var g = new dagreD3.graphlib.Graph()
  .setGraph({})
  .setDefaultEdgeLabel(function() {
    return {}
  })

// ... your code goes here

// Run the renderer. This is what draws the final graph.
render(svgGroup, g)
       ^^^^^^^^

Let me know if everything works as expected.

Cheers!