• 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>
            html,
            body {
                height: 100%;
                width: 100%;
                margin: 0;
                padding: 0;
                background-color: #fff;
            }
    
            #myChart {
                height: 100%;
                width: 100%;
                min-height: 150px;
            }
    
            .zc-ref {
                display: none;
            }
    
            button {
                padding: 10px;
                margin: 10px;
            }
    
            zing-grid[loading] {
                height: 859px;
            }
        </style>
    </head>
    
    <body>
        <button onClick="toggleChartType();">Toggle Chart Type</button>
        <div id="myChart"><a class="zc-ref" href="https://www.zingchart.com">Powered by ZingChart</a></div>
        <script>
            ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];
            var currentChartType = 'line3d';
    
            function toggleChartType() {
                if (currentChartType === 'line3d') currentChartType = 'area3d';
                else currentChartType = 'line3d';
    
                // use api to preserve zoom and set chart type
                zingchart.exec('myChart', 'setcharttype', {
                    type: currentChartType,
                    'preserve-state': true
                });
            }
    
            // window.onload 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
    
                var myConfig = {
                    "graphset": [{
                        "3d-aspect": {
                            "zoom": 0.7,
                            "offset-x": -150,
                            "x-angle": -25,
                            "y-angle": -25,
                            "z-angle": 0,
                            "depth": 400
                        },
                        "globals": {
                            "font-family": "Lucida Sans Unicode"
                        },
                        "type": "line3d",
                        "plotarea": {
                            "margin": "50 0 250 0"
                        },
                        preview: {
                            mask: {
                                backgroundColor: '#1565c0'
                            }
                        },
                        "scaleX": {
                            "zooming": true,
                            "normalize": true,
                            "max-items": 9,
                            "background-color": "#fff",
                            "guide": {
                                "visible": true
                            },
                            "tick": {
                                "line-width": 1,
                                "line-color": "#000",
                                "visible": true,
                                "size": 10
                            },
                            "item": {
                                "padding": 10,
                                "angle": 0,
                                "lock-rotation": true
                            },
                            "axis": {
                                "line-width": 4,
                                "line-color": "#000"
                            },
                            "label": {
                                "font-size": 12,
                                "text": "f(Hz)"
                            }
                        },
                        "scaleY": {
                            "values": "0:6:1",
                            "background-color": "#fff",
                            "tick": {
                                "line-width": 1,
                                "line-color": "#000",
                                "visible": true,
                                "size": 10
                            },
                            "guide": {
                                "visible": true
                            },
                            "axis": {
                                "line-width": 4,
                                "line-color": "#000"
                            },
                            "item": {
                                "padding": 10,
                                "angle": 0,
                                "lock-rotation": true
                            },
                            "label": {
                                "font-size": 12,
                                "text": "A(mm/s)"
                            }
                        },
                        "scaleZ": {
                            "axis": {
                                "line-color": "#000",
                                "line-width": 2
                            },
                            "values": ["10-10-09", "10-12-09", "11-01-13", "11-03-08", "11-06-09", "11-07-06"],
                            "guide": {
                                "visible": true
                            },
                            "item": {
                                "lock-rotation": true,
                                "font-size": 10,
                                "auto-align": true
                            },
                            "label": {
                                "font-size": 12,
                                "font-weight": "bold",
                                "text": "Sample"
                            },
                            "tick": {
                                "line-color": "#000",
                                "size": 10
                            }
                        },
                        "plot": {
                            "depth": 1,
                        },
                        "labels": [{
                                "id": "flag_1",
                                "text": "A",
                                "hook": "node:plot=3,index=20",
                                "3d": true,
                                "background-color": "#eee",
                                "width": 25,
                                "height": 25,
                                "font-weight": "bold",
                                "border-radius": 9,
                                "callout": true,
                                "callout-position": "bottom",
                                "callout-height": 1,
                                "callout-extension": 20,
                                "offset-y": -35,
                                "anchor": "c",
                                "border-width": 1,
                                "border-color": "#999"
                            },
                            {
                                "id": "flag_2",
                                "text": "B",
                                "hook": "node:plot=5,index=40",
                                "3d": true,
                                "background-color": "#eee",
                                "width": 25,
                                "height": 25,
                                "padding-left": 8,
                                "font-weight": "bold",
                                "border-radius": "-12 3 0 -12",
                                "callout": true,
                                "callout-position": "bottom",
                                "callout-offset": "0% 48%",
                                "callout-height": 1,
                                "callout-width": 0,
                                "callout-extension": 20,
                                "offset-y": -35,
                                "offset-x": -10,
                                "anchor": "c",
                                "border-width": 1,
                                "border-color": "#999"
                            }
                        ],
                        "series": [{
                                "text": "Frequency Signal A",
                                "line-color": "#036",
                                "border-color": "#036",
                                "background-color": "#036",
                                "values": [0, 0.240125, 0.241725, 0.116675, 0.0817, 0.057025, 0.13415, 0.19035, 0.05725, 0.15895, 0.239125, 0.216425, 0.157075, 0.17205, 0.1821, 0.21815, 0.22315, 0.1023, 0.06555, 0.028275, 5.0076, 0.04225, 0.112325, 0.16975, 0.04685, 0.06275, 0.203125, 0.18285, 0.247725, 0.090175, 0.186875, 0.10225, 0.0446, 0.029925, 0.2173, 0.04345, 0.167125, 0.066925, 0.1486, 0.14975, 2.9928, 0.05105, 0.013525, 0.188475, 0.059925, 0.0501, 0.2203, 0.127825, 0.22935, 0.0308, 0.24365, 0.10705, 0.145275, 0.02725, 0.066425, 0.084275, 0.0222, 0.0272, 0.19085, 0.18555, 1.799, 0.184525, 0.129525, 0.12895, 0.184125, 0.1376, 0.23655, 0.143875, 0.009575, 0.194675, 0.0748, 0.0327, 0.04325, 0.189625, 0.23765, 0.180925, 0.02745, 0.241725, 0.14705, 0.23445, 1.9782, 0.147925, 0.10615, 0.00585, 0.01825, 0.0238, 0.162575, 0.100725, 0.089, 0.059125, 0.1054, 0.115275, 0.0861, 0.1532, 0.08395, 0.1783, 0.04565, 0.196425, 0.139725, 0.09185]
                            },
                            {
                                "text": "Frequency Signal B",
                                "line-color": "#036",
                                "border-color": "#036",
                                "background-color": "#036",
                                "values": [0, 0.04765, 0.229675, 0.164325, 0.12305, 0.0493, 0.141775, 0.2385, 0.0663, 0.220425, 0.08605, 0.09045, 0.183275, 0.06865, 0.182825, 0.0192, 0.219475, 0.2252, 0.0239, 0.050675, 4.857, 0.092725, 0.081775, 0.033225, 0.025325, 0.08295, 0.025025, 0.1374, 0.140425, 0.03755, 0.049925, 0.0699, 0.030725, 0.0615, 0.042175, 0.031625, 0.2007, 0.21435, 0.20495, 0.033375, 1.9042, 0.039025, 0.061325, 0.09985, 0.184075, 0.048875, 0.2033, 0.171375, 0.2224, 0.08285, 0.134425, 0.00305, 0.037225, 0.172125, 0.1231, 0.0902, 0.13445, 0.00895, 0.1412, 0.157325, 2.354, 0.06535, 0.057075, 0.126775, 0.2422, 0.041075, 0.0262, 0.064525, 0.128275, 0.0285, 0.111325, 0.145575, 0.080825, 0.218425, 0.101975, 0.051125, 0.072175, 0.132775, 0.184625, 0.2246, 2.5586, 0.032825, 0.1001, 0.2146, 0.1053, 0.127025, 0.111125, 0.131675, 0.0935, 0.133175, 0.0289, 0.0611, 0.200375, 0.114525, 0.165425, 0.227125, 0.1268, 0.0472, 0.140275, 0.0521]
                            },
                            {
                                "text": "Frequency Signal C",
                                "line-color": "#036",
                                "border-color": "#036",
                                "background-color": "#036",
                                "values": [0, 0.12305, 0.1833, 0.00445, 0.08415, 0.211225, 0.097975, 0.031375, 0.24065, 0.1191, 0.0094, 0.172625, 0.153175, 0.085875, 0.106925, 0.17615, 0.07465, 0.16105, 0.014925, 0.1509, 4.3374, 0.077775, 0.052025, 0.061075, 0.1103, 0.159525, 0.0052, 0.0807, 0.068, 0.219, 0.0362, 0.1607, 0.23825, 0.168575, 0.2387, 0.229625, 0.14505, 0.075625, 0.190125, 0.008925, 2.6576, 0.172, 0.20855, 0.212825, 0.185975, 0.2214, 0.136075, 0.0746, 0.166825, 0.013575, 0.122525, 0.23895, 0.163, 0.186225, 0.15285, 0.16025, 0.07105, 0.153575, 0.02615, 0.061925, 2.8376, 0.029475, 0.037175, 0.12175, 0.12565, 0.120075, 0.11425, 0.158925, 0.11185, 0.171525, 0.029775, 0.122725, 0.00385, 0.0244, 0.153325, 0.21345, 0.02525, 0.18665, 0.0009, 0.057275, 2.299, 0.07925, 0.00425, 0.1762, 0.1591, 0.102525, 0.1949, 0.077925, 0.182925, 0.208, 0.16595, 0.192125, 0.1543, 0.16915, 0.02085, 0.16885, 0.0172, 0.068525, 0.2043, 0.0178]
                            },
                            {
                                "text": "Frequency Signal D",
                                "line-color": "#036",
                                "border-color": "#036",
                                "background-color": "#036",
                                "values": [0, 0.061125, 0.23525, 0.122625, 0.01135, 0.2079, 0.046675, 0.030775, 0.1752, 0.1649, 0.109075, 0.211675, 0.1891, 0.179575, 0.176075, 0.127275, 0.17245, 0.0756, 0.11785, 0.18145, 5.4432, 0.16135, 0.014525, 0.20245, 0.1938, 0.05945, 0.24555, 0.1326, 0.142275, 0.1019, 0.2457, 0.19145, 0.210175, 0.2021, 0.076725, 0.094725, 0.1455, 0.110525, 0.04735, 0.249475, 1.2322, 0.0374, 0.125025, 0.094525, 0.1704, 0.234975, 0.052575, 0.06755, 0.173025, 0.194125, 0.206275, 0.10265, 0.056875, 0.064475, 0.027625, 0.1289, 0.01435, 0.171275, 0.06275, 0.1186, 1.7792, 0.239825, 0.073475, 0.223375, 0.22615, 0.1011, 0.2384, 0.104725, 0.21935, 0.2401, 0.179525, 0.0215, 0.129125, 0.0091, 0.197925, 0.1963, 0.012725, 0.1605, 0.22295, 0.0698, 2.91, 0.21635, 0.2494, 0.21185, 0.078975, 0.17825, 0.009875, 0.22355, 0.000275, 0.185325, 0.230325, 0.12315, 0.2281, 0.030175, 0.032625, 0.1834, 0.16355, 0.248475, 0.05535, 0.178025]
                            },
                            {
                                "text": "Frequency Signal E",
                                "line-color": "#036",
                                "border-color": "#036",
                                "background-color": "#036",
                                "values": [0, 0.141425, 0.153125, 0.080475, 0.056425, 0.162025, 0.1762, 0.21255, 0.19945, 0.156025, 0.173375, 0.11865, 0.145325, 0.06465, 0.115475, 0.2294, 0.1944, 0.24305, 0.123425, 0.145375, 5.2707999999999995, 0.10995, 0.237825, 0.188125, 0.158125, 0.0246, 0.1739, 0.104325, 0.13385, 0.14455, 0.180725, 0.098125, 0.011125, 0.04875, 0.057875, 0.0632, 0.225825, 0.118275, 0.067375, 0.064525, 2.1844, 0.0782, 0.03325, 0.10585, 0.014225, 0.210675, 0.07355, 0.233825, 0.161175, 0.153975, 0.070975, 0.179025, 0.1047, 0.199375, 0.178725, 0.06565, 0.010325, 0.051925, 0.0583, 0.154875, 1.613, 0.034625, 0.00565, 0.072925, 0.13185, 0.199275, 0.05085, 0.123425, 0.18625, 0.0971, 0.037375, 0.0445, 0.1031, 0.0081, 0.169, 0.0481, 0.01185, 0.04585, 0.1423, 0.18615, 2.7898, 0.118275, 0.18615, 0.19125, 0.00305, 0.1035, 0.00665, 0.029025, 0.13445, 0.147475, 0.24515, 0.072, 0.072125, 0.15895, 0.0162, 0.14785, 0.005125, 0.2314, 0.22795, 0.070825]
                            },
                            {
                                "text": "Frequency Signal E",
                                "line-color": "#036",
                                "border-color": "#036",
                                "background-color": "#036",
                                "values": [0, 0.198625, 0.117175, 0.0574, 0.192925, 0.20415, 0.054, 0.051, 0.0631, 0.03455, 0.0339, 0.1756, 0.19745, 0.0029, 0.212175, 0.221075, 0.063075, 0.01065, 0.032425, 0.087, 4.2678, 0.201325, 0.086275, 0.207775, 0.138225, 0.16355, 0.163225, 0.080275, 0.06855, 0.05205, 0.1909, 0.202475, 0.158125, 0.241625, 0.088325, 0.014325, 0.213125, 0.0594, 0.061775, 0.093825, 1.2554, 0.162025, 0.111425, 0.134, 0.23245, 0.1409, 0.049975, 0.068025, 0.12455, 0.180275, 0.2253, 0.114925, 0.128525, 0.23495, 0.10605, 0.231425, 0.231025, 0.071375, 0.2133, 0.032775, 1.8766, 0.0052, 0.107775, 0.066425, 0.12715, 0.0434, 0.1038, 0.20895, 0.230925, 0.1794, 0.109475, 0.0854, 0.091425, 0.156825, 0.1059, 0.247425, 0.1059, 0.023825, 0.120025, 0.111025, 2.6764, 0.0406, 0.041425, 0.2013, 0.027525, 0.193025, 0.181525, 0.150725, 0.2349, 0.11445, 0.14445, 0.134725, 0.010475, 0.200025, 0.139625, 0.070925, 0.017775, 0.24175, 0.01185, 0.1457]
                            }
                        ]
                    }]
                };
    
                zingchart.render({
                    id: 'myChart',
                    data: myConfig,
                    height: '100%',
                    width: '100%'
                });
            });
        </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>
        <button onClick="toggleChartType();">Toggle Chart Type</button>
    		<div id="myChart"><a class="zc-ref" href="https://www.zingchart.com">Powered by ZingChart</a></div>
    	</body>
    </html>
    html, body {
    	height:100%;
    	width:100%;
    	margin:0;
    	padding:0;
      background-color: #fff;
    }
    #myChart {
    	height:100%;
    	width:100%;
    	min-height:150px;
    }
    .zc-ref {
    	display:none;
    }
    button { padding:10px; margin:10px; }
    var currentChartType = 'line3d';
    function toggleChartType() {
      if (currentChartType === 'line3d') currentChartType = 'area3d';
      else currentChartType = 'line3d';
      
      // use api to preserve zoom and set chart type
      zingchart.exec('myChart', 'setcharttype', {
        type: currentChartType,
        'preserve-state': true
      });
    }
    
    // window.onload 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
    
      var myConfig = {
      "graphset":[
          {
              "3d-aspect":{
                  "zoom":0.7,
                  "offset-x":-150,
                  "x-angle":-25,
                  "y-angle":-25,
                  "z-angle":0,
                  "depth":400
              },
              "globals":{
                  "font-family":"Lucida Sans Unicode"
              },
              "type":"line3d",
              "plotarea":{
                  "margin":"50 0 250 0"
              },
              preview: {
                mask: {
                 backgroundColor: '#1565c0'
                }
              },
              "scaleX":{
                  "zooming": true,
                  "normalize":true,
                  "max-items":9,
                  "background-color":"#fff",
                  "guide":{
                      "visible":true
                  },
                  "tick":{
                      "line-width":1,
                      "line-color":"#000",
                      "visible":true,
                      "size":10
                  },
                  "item":{
                      "padding":10,
                      "angle":0,
                      "lock-rotation":true
                  },
                  "axis":{
                      "line-width":4,
                      "line-color":"#000"
                  },
                  "label":{
                      "font-size":12,
                      "text":"f(Hz)"
                  }
              },
              "scaleY":{
                  "values":"0:6:1",
                  "background-color":"#fff",
                  "tick":{
                      "line-width":1,
                      "line-color":"#000",
                      "visible":true,
                      "size":10
                  },
                  "guide":{
                      "visible":true
                  },
                  "axis":{
                      "line-width":4,
                      "line-color":"#000"
                  },
                  "item":{
                      "padding":10,
                      "angle":0,
                      "lock-rotation":true
                  },
                  "label":{
                      "font-size":12,
                      "text":"A(mm/s)"
                  }
              },
              "scaleZ":{
                  "axis":{
                      "line-color":"#000",
                      "line-width":2
                  },
                  "values":["10-10-09","10-12-09","11-01-13","11-03-08","11-06-09","11-07-06"],
                  "guide":{
                      "visible":true
                  },
                  "item":{
                      "lock-rotation":true,
                      "font-size":10,
                      "auto-align":true
                  },
                  "label":{
                      "font-size":12,
                      "font-weight":"bold",
                      "text":"Sample"
                  },
                  "tick":{
                      "line-color":"#000",
                      "size":10
                  }
              },
              "plot":{
                  "depth":1,
              },
              "labels":[
                  {
                      "id":"flag_1",
                      "text":"A",
                      "hook":"node:plot=3,index=20",
                      "3d":true,
                      "background-color":"#eee",
                      "width":25,
                      "height":25,
                      "font-weight":"bold",
                      "border-radius":9,
                      "callout":true,
                      "callout-position":"bottom",
                      "callout-height":1,
                      "callout-extension":20,
                      "offset-y":-35,
                      "anchor":"c",
                      "border-width":1,
                      "border-color":"#999"
                  },
                  {
                      "id":"flag_2",
                      "text":"B",
                      "hook":"node:plot=5,index=40",
                      "3d":true,
                      "background-color":"#eee",
                      "width":25,
                      "height":25,
                      "padding-left":8,
                      "font-weight":"bold",
                      "border-radius":"-12 3 0 -12",
                      "callout":true,
                      "callout-position":"bottom",
                      "callout-offset":"0% 48%",
                      "callout-height":1,
                      "callout-width":0,
                      "callout-extension":20,
                      "offset-y":-35,
                      "offset-x":-10,
                      "anchor":"c",
                      "border-width":1,
                      "border-color":"#999"
                  }
              ],
              "series":[
                  {
                      "text":"Frequency Signal A",
                      "line-color":"#036",
                      "border-color":"#036",
                      "background-color":"#036",
                      "values":[0,0.240125,0.241725,0.116675,0.0817,0.057025,0.13415,0.19035,0.05725,0.15895,0.239125,0.216425,0.157075,0.17205,0.1821,0.21815,0.22315,0.1023,0.06555,0.028275,5.0076,0.04225,0.112325,0.16975,0.04685,0.06275,0.203125,0.18285,0.247725,0.090175,0.186875,0.10225,0.0446,0.029925,0.2173,0.04345,0.167125,0.066925,0.1486,0.14975,2.9928,0.05105,0.013525,0.188475,0.059925,0.0501,0.2203,0.127825,0.22935,0.0308,0.24365,0.10705,0.145275,0.02725,0.066425,0.084275,0.0222,0.0272,0.19085,0.18555,1.799,0.184525,0.129525,0.12895,0.184125,0.1376,0.23655,0.143875,0.009575,0.194675,0.0748,0.0327,0.04325,0.189625,0.23765,0.180925,0.02745,0.241725,0.14705,0.23445,1.9782,0.147925,0.10615,0.00585,0.01825,0.0238,0.162575,0.100725,0.089,0.059125,0.1054,0.115275,0.0861,0.1532,0.08395,0.1783,0.04565,0.196425,0.139725,0.09185]
                  },
                  {
                      "text":"Frequency Signal B",
                      "line-color":"#036",
                      "border-color":"#036",
                      "background-color":"#036",
                      "values":[0,0.04765,0.229675,0.164325,0.12305,0.0493,0.141775,0.2385,0.0663,0.220425,0.08605,0.09045,0.183275,0.06865,0.182825,0.0192,0.219475,0.2252,0.0239,0.050675,4.857,0.092725,0.081775,0.033225,0.025325,0.08295,0.025025,0.1374,0.140425,0.03755,0.049925,0.0699,0.030725,0.0615,0.042175,0.031625,0.2007,0.21435,0.20495,0.033375,1.9042,0.039025,0.061325,0.09985,0.184075,0.048875,0.2033,0.171375,0.2224,0.08285,0.134425,0.00305,0.037225,0.172125,0.1231,0.0902,0.13445,0.00895,0.1412,0.157325,2.354,0.06535,0.057075,0.126775,0.2422,0.041075,0.0262,0.064525,0.128275,0.0285,0.111325,0.145575,0.080825,0.218425,0.101975,0.051125,0.072175,0.132775,0.184625,0.2246,2.5586,0.032825,0.1001,0.2146,0.1053,0.127025,0.111125,0.131675,0.0935,0.133175,0.0289,0.0611,0.200375,0.114525,0.165425,0.227125,0.1268,0.0472,0.140275,0.0521]
                  },
                  {
                      "text":"Frequency Signal C",
                      "line-color":"#036",
                      "border-color":"#036",
                      "background-color":"#036",
                      "values":[0,0.12305,0.1833,0.00445,0.08415,0.211225,0.097975,0.031375,0.24065,0.1191,0.0094,0.172625,0.153175,0.085875,0.106925,0.17615,0.07465,0.16105,0.014925,0.1509,4.3374,0.077775,0.052025,0.061075,0.1103,0.159525,0.0052,0.0807,0.068,0.219,0.0362,0.1607,0.23825,0.168575,0.2387,0.229625,0.14505,0.075625,0.190125,0.008925,2.6576,0.172,0.20855,0.212825,0.185975,0.2214,0.136075,0.0746,0.166825,0.013575,0.122525,0.23895,0.163,0.186225,0.15285,0.16025,0.07105,0.153575,0.02615,0.061925,2.8376,0.029475,0.037175,0.12175,0.12565,0.120075,0.11425,0.158925,0.11185,0.171525,0.029775,0.122725,0.00385,0.0244,0.153325,0.21345,0.02525,0.18665,0.0009,0.057275,2.299,0.07925,0.00425,0.1762,0.1591,0.102525,0.1949,0.077925,0.182925,0.208,0.16595,0.192125,0.1543,0.16915,0.02085,0.16885,0.0172,0.068525,0.2043,0.0178]
                  },
                  {
                      "text":"Frequency Signal D",
                      "line-color":"#036",
                      "border-color":"#036",
                      "background-color":"#036",
                      "values":[0,0.061125,0.23525,0.122625,0.01135,0.2079,0.046675,0.030775,0.1752,0.1649,0.109075,0.211675,0.1891,0.179575,0.176075,0.127275,0.17245,0.0756,0.11785,0.18145,5.4432,0.16135,0.014525,0.20245,0.1938,0.05945,0.24555,0.1326,0.142275,0.1019,0.2457,0.19145,0.210175,0.2021,0.076725,0.094725,0.1455,0.110525,0.04735,0.249475,1.2322,0.0374,0.125025,0.094525,0.1704,0.234975,0.052575,0.06755,0.173025,0.194125,0.206275,0.10265,0.056875,0.064475,0.027625,0.1289,0.01435,0.171275,0.06275,0.1186,1.7792,0.239825,0.073475,0.223375,0.22615,0.1011,0.2384,0.104725,0.21935,0.2401,0.179525,0.0215,0.129125,0.0091,0.197925,0.1963,0.012725,0.1605,0.22295,0.0698,2.91,0.21635,0.2494,0.21185,0.078975,0.17825,0.009875,0.22355,0.000275,0.185325,0.230325,0.12315,0.2281,0.030175,0.032625,0.1834,0.16355,0.248475,0.05535,0.178025]
                  },
                  {
                      "text":"Frequency Signal E",
                      "line-color":"#036",
                      "border-color":"#036",
                      "background-color":"#036",
                      "values":[0,0.141425,0.153125,0.080475,0.056425,0.162025,0.1762,0.21255,0.19945,0.156025,0.173375,0.11865,0.145325,0.06465,0.115475,0.2294,0.1944,0.24305,0.123425,0.145375,5.2707999999999995,0.10995,0.237825,0.188125,0.158125,0.0246,0.1739,0.104325,0.13385,0.14455,0.180725,0.098125,0.011125,0.04875,0.057875,0.0632,0.225825,0.118275,0.067375,0.064525,2.1844,0.0782,0.03325,0.10585,0.014225,0.210675,0.07355,0.233825,0.161175,0.153975,0.070975,0.179025,0.1047,0.199375,0.178725,0.06565,0.010325,0.051925,0.0583,0.154875,1.613,0.034625,0.00565,0.072925,0.13185,0.199275,0.05085,0.123425,0.18625,0.0971,0.037375,0.0445,0.1031,0.0081,0.169,0.0481,0.01185,0.04585,0.1423,0.18615,2.7898,0.118275,0.18615,0.19125,0.00305,0.1035,0.00665,0.029025,0.13445,0.147475,0.24515,0.072,0.072125,0.15895,0.0162,0.14785,0.005125,0.2314,0.22795,0.070825]
                  },
                  {
                      "text":"Frequency Signal E",
                      "line-color":"#036",
                      "border-color":"#036",
                      "background-color":"#036",
                      "values":[0,0.198625,0.117175,0.0574,0.192925,0.20415,0.054,0.051,0.0631,0.03455,0.0339,0.1756,0.19745,0.0029,0.212175,0.221075,0.063075,0.01065,0.032425,0.087,4.2678,0.201325,0.086275,0.207775,0.138225,0.16355,0.163225,0.080275,0.06855,0.05205,0.1909,0.202475,0.158125,0.241625,0.088325,0.014325,0.213125,0.0594,0.061775,0.093825,1.2554,0.162025,0.111425,0.134,0.23245,0.1409,0.049975,0.068025,0.12455,0.180275,0.2253,0.114925,0.128525,0.23495,0.10605,0.231425,0.231025,0.071375,0.2133,0.032775,1.8766,0.0052,0.107775,0.066425,0.12715,0.0434,0.1038,0.20895,0.230925,0.1794,0.109475,0.0854,0.091425,0.156825,0.1059,0.247425,0.1059,0.023825,0.120025,0.111025,2.6764,0.0406,0.041425,0.2013,0.027525,0.193025,0.181525,0.150725,0.2349,0.11445,0.14445,0.134725,0.010475,0.200025,0.139625,0.070925,0.017775,0.24175,0.01185,0.1457]
                  }
              ]
          }
      ]
      };
    
      zingchart.render({ 
        id: 'myChart', 
        data: myConfig, 
        height: '100%', 
        width: '100%' 
      });
    });