CODEWITHSUNDEEP
javascriptd3.jsplotly
Larry Martell
Larry Martell

Reputation: 3756

d3 not being found from plotly

I am trying to create my first chart with plotly. This is part of a django app. In my template I have this:

<script type="text/javascript" src="/static/scripts/heatmap.js"></script>
<script type="text/javascript" src="/static/scripts/plotly/plotly.min.js"></script>
<script type="text/javascript" src="/static/scripts/plotly/dependencies/d3.v3.min.js"></script>

And I call a js function that is defined in heatmap.js:

<script>
   generate_heatmap();
</script>

Which looks like this:

function generate_heatmap() {
   var data = [...];
   var layout = { ... };
   var graphOptions = {layout: layout};
   plotly.plot(data, graphOptions, function (err, msg) {
      console.log(msg);
   });
}

And I get this in the js console:

plotly.min.js:12 Uncaught ReferenceError: d3 is not defined
n.23../isnumeric @ plotly.min.js:12a @ plotly.min.js:6(anonymous function) @ plotly.min.js:6n.28.../../../../shelly/static/js/plugins/promise-1.0.0.min.js @ plotly.min.js:14a @ plotly.min.js:6t @ plotly.min.js:6(anonymous function) @ plotly.min.js:6(anonymous function) @ plotly.min.js:6(anonymous function) @ plotly.min.js:6

But I can see that d3 has been loaded, both in the network tab and in the console:

d3
Object {version: "3.3.5", behavior: Object, event: null, ns: Object, geo: Object…}

What stupid thing am I doing wrong?

Upvotes: 0

Views: 1498

Answers (1)

mic4ael
mic4ael

Reputation: 8310

You have to change the order of the files included.

<script type="text/javascript" src="/static/scripts/plotly/dependencies/d3.v3.min.js"></script>
<script type="text/javascript" src="/static/scripts/plotly/plotly.min.js"></script>

Upvotes: 3

Related Questions