D3 v5 in Qlik Sense Mashup

[petgr138]

Hi,

I'm trying to build a mashup using d3 v5 using require.js to load it.
This seems to be working fine as long as I try to use it within the scope of my main function in the script.
However, when trying to use it within the callback of app.createCube() d3 v3 is used instead. I have checked this by writing d3 to the console log from within the main function and from within the callback.

Why is this and how can I fix it?

Thankful for any tips

Best regards
Petter

Below are some code snippets



require.config({
baseUrl: (config.isSecure ? "https://" : "http://") + config.host + (config.port ? ":" + config.port : "") + config.prefix + "resources",
paths: {
d3: "https://d3js.org/d3.v5.min"
}
});

require(["js/qlik", "d3"], function (qlik, d3) {
var control = false;
qlik.setOnError(function (error) {
$('#popupText').append(error.message + "<br>");
if (!control) {
control = true;
$('#popup').delay(1000).fadeIn(1000).delay(11000).fadeOut(1000);
}
});
$("body").css("overflow: hidden;");

var app = qlik.openApp('XXXXXXXXX, config);


console.log(d3); //This will log all functions of d3 v5 as expected

app.createCube(<CUBE_CONFIG>, doSomethingWithCube); //CUBE_CONFIG can be any cube

});

function doSomethingWithCube(reply, app) {
  console.log(d3); //This will log all functions from d3 v3 instead of v5 for some reason
}

[ErikWetterberg]

Yes, the dependencies you define in your require call will be defined inside the function you send in to require, but outside of that function it will  not, so you will get the global D3 used by Qlik Sense.

You need to move the function where you use D3 to inside the require callback.