using external libraries in qlik custom extension

hzozimo — Tue, 08 Feb 2022 17:45:26 GMT

Hi!

I am trying to use a external library in my custom extension.

I am loading it with the require JS, but the initializer of the library don't work

heres my code: (I removed the sensitive data)

the thing is, the .timeline at the end of the code initializes my library (ploting the timeline in the document).

This code works perfectly when I used in the vsCode with jquery and <script> in the HTML, but I can't make it works when I try to use requireJS and qlik, it says timeline is not defined.

----

define(["jquery","lib/js/extensionUtils/jquery.timeline.min","text!./jquery.timeline.min.css"], function ($, timeline,cssContent) {
"use strict";
$('<style/>').html(cssContent).appendTo("head");
return {
definition: {
type: "items",
component: "accordion",
items: {
dimensions: {
uses: "dimensions",
},
measures: {
uses: "measures",
},
sorting: {
uses: "sorting",
},
appearance: {
uses: "settings",
},
},
},
initialProperties: {
qHyperCubeDef: {
qDimensions: [],
qMeasures: [],
qInitialDataFetch: [
{
qWidth: 10,
qHeight: 100,
},
],
},
},
paint: function ($element, layout) {
$element.empty();

const div = $("<div/>").attr("id", "myTimeline");
const ul = $("<ul/>").addClass("timeline-events");
$element.append(div);
div.append(ul);

$(() => {
$('#myTimeline').timeline({
startDatetime: "2022-01-02",
endDatetime: "auto",
rangeAlign: "center",
scale: "years",
range: "1",
rows: 10,
type: "bar",
})
});

};
});

topic using external libraries in qlik custom extension in Integration, Extension & APIs

using external libraries in qlik custom extension