• Edit
  • Download
  • <!DOCTYPE html>
    <html>
    
    <head>
      <meta charset="utf-8">
      <title>ZingSoft Demo</title>
    
      <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
      <style></style>
    </head>
    
    <body>
      <div id="myChart"></div>
      <script>
        ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"]; // window:load event for Javascript to run after HTML
        // because this Javascript is injected into the document head
        window.addEventListener('load', () => {
          // Javascript code to execute after DOM content
    
          // full ZingChart schema can be found here:
          // https://www.zingchart.com/docs/api/json-configuration/
          let myConfig = {
            type: "bar",
            images: [{
              src: 'https://firebasestorage.googleapis.com/v0/b/zingchart-com.appspot.com/o/kitten.jpg?alt=media&token=cbf08480-aa33-4574-a605-c857177a791f',
              x: -150,
              y: -130,
            }],
            series: [{
                values: [35, 42, 67, 89, 25, 34, 67, 85]
              },
              {
                values: [27, 36, 60, 74, 17, 45, 75, 90]
              },
              {
                values: [20, 30, 45, 68, 14, 51, 77, 92]
              }
            ]
          };
    
          // render the chart right away
          zingchart.render({
            id: 'myChart',
            data: myConfig,
          });
        });
      </script>
    </body>
    
    </html>
    <!DOCTYPE html>
    <html>
    
    <head>
      <meta charset="utf-8">
      <title>ZingSoft Demo</title>
    
      <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
    </head>
    
    <body>
      <div id="myChart"></div>
    </body>
    
    </html>
    
          
    // window:load event for Javascript to run after HTML
    // because this Javascript is injected into the document head
    window.addEventListener('load', () => {
      // Javascript code to execute after DOM content
    
      // full ZingChart schema can be found here:
      // https://www.zingchart.com/docs/api/json-configuration/
      let myConfig = {
        type: "bar",
        images: [{
          src: 'https://firebasestorage.googleapis.com/v0/b/zingchart-com.appspot.com/o/kitten.jpg?alt=media&token=cbf08480-aa33-4574-a605-c857177a791f',
          x: -150,
          y: -130,
        }],
        series: [{
            values: [35, 42, 67, 89, 25, 34, 67, 85]
          },
          {
            values: [27, 36, 60, 74, 17, 45, 75, 90]
          },
          {
            values: [20, 30, 45, 68, 14, 51, 77, 92]
          }
        ]
      };
    
      // render the chart right away
      zingchart.render({
        id: 'myChart',
        data: myConfig,
      });
    });