test.js:3 Uncaught TypeError: $(...).timeline is not a function

[LazyException]

Describe the bug
I have the error 👍
test.js:3 Uncaught TypeError: $(...).timeline is not a function
To Reproduce
Steps to reproduce the behavior:
Html :

<title>Calendrier à Chronologie Horizontale</title>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="js/jquery.timeline.min.js"></script>
<script src="js/test.js"></script>

<!-- Scripts -->

• Event Label
• Event Label

JS

$(window).on("load", function() {
$("#myTimeline").timeline('show');
});

Expected behavior
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: Ubuntu 20
• Browser chrome
• Version [e.g. 22]

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

[ka215]

Hi there,
Since version 2 of jquery.timeline, the constructor name has changed from all lowercase of "timeline" to capital case of "Timeline". Please note that the first "T" is capitalized.

$("#myTimeline").timeline('show');// <- ng

$("#myTimeline").Timeline('show');// <- ok

Thank you.

[LazyException]

Thank you for your quick response :) I would like to take this opportunity to ask you if it is possible to recover the JS configuration from your demo timeline? I cannot display the same rendering: https://ka2.org/jqtl-v2/ I of course took the time to consult your documentation

[ka215]

I modified tester page.
Clicking the view options button added to the advanced menu displays initialization options for the currently output jQuery.timeline.

[LazyException]

Very CRAZYYY ! Thanks a lot

Last answer pleaseee...
how did you make the event colors different for each event?

I'm surprised to see that you didn't use the hookEventColors attribute in the colorScheme object

[ka215]

We can specify a color for each event node, so on the tester page, the color is specified on the event node side.
For example:

[{
  "uid": "18b51549b763c",
  "eventId": 1,
  "x": 2840.27,
  "y": 51,
  "width": 70.5,
  "height": 44,
  "start": "2023-12-18 04:08",
  "end": "2023-12-19 15:23",
  "row": 2,
  "bgColor": "#c1aa30",
  "color": "#101010",
  "bdColor": "#6C757D",
  "label": "Ut lacinia metus Nam ut Lorem Ut lacinia",
  "content": "Nunc ...",
  "category": "",
  "image": "",
  "margin": 2,
  "rangeMeta": "",
  "size": "normal",
  "type": "",
  "extend": {},
  "remote": false,
  "relation": {}
},
...
]

The event node data that is randomly generated on the tester page is cached in the session storage, so you can check the contents of the "div#my-timeline" key in the session storage using the browser's dev tools (press "F12" key).

Best regards.