Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. External JS Library: Add graphical element

External JS Library: Add graphical element

Scheduled Pinned Locked Moved Unsolved QML and Qt Quick
1 Posts 1 Posters 444 Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • F Offline
    F Offline
    fem_dev
    wrote on last edited by
    #1

    Hi, I'm a C++ developer and a new user of QML.

    I would like to know if is possible to show a JS graphical element from a external JS library inside the QML application.
    I know that Qt have some built in charts, but I want to display my chart using this JS library called plotly.js
    Website link here.

    Here is my full HTML + JS source. I tested it on my local browser and it displays a 2D line chart using plotly.js.

    <html>
        <head>
            <!-- Plotly.js -->
            <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
          </head>
          
          <!-- Plots go in blank <div> elements. 
              You can size them in the plot layout,
              or give the div a size as shown here.
          -->
          <div id="tester" style="width:90%;height:250px;"></div>
          <script>
    
          TESTER = document.getElementById('tester');
          
          Plotly.plot( TESTER, [{
              x: [1, 2, 3, 4, 5],
              y: [1, 2, 4, 8, 16] }], { 
              margin: { t: 0 } }, {showSendToCloud:true} 
              );
          </script>
    </html>
    

    Output:
    cca44b57-95e6-4026-aa50-1293072fcc0f-image.png

    Is possible to put it inside my QML application?
    How can I do it?

    1 Reply Last reply
    0

    • Login

    • Login or register to search.
    • First post
      Last post
    0
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search
    • Get Qt Extensions
    • Unsolved