• Edit
  • Download
    1. <!DOCTYPE html>
    2. <html>
    3.  
    4. <head>
    5.   <meta charset="utf-8">
    6.   <title>ZingSoft Demo</title>
    7.   <script nonce="undefined" src='//code.jquery.com/jquery-2.1.4.min.js'></script>
    8.   <script nonce="undefined" src='//code.jquery.com/ui/1.11.4/jquery-ui.min.js'></script>
    9.   <link rel='stylesheet' href='//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css'>
    10.  
    11.   <script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
    12.   <style>
    13.     .container {
    14.       width: 400px;
    15.       height: 200px;
    16.       min-width: 400px;
    17.       border: 1px dashed #777;
    18.     }
    19.  
    20.     #myChart {
    21.       width: 100%;
    22.       height: 100%;
    23.     }
    24.   </style>
    25. </head>
    26.  
    27. <body>
    28.   <div class='container'>
    29.     <div id='myChart'></div>
    30.   </div>
    31.   <script>
    32.     ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];
    33.     let chartConfig = {
    34.       type: 'mixed',
    35.       title: {
    36.         text: 'Crosshairs at 100% width',
    37.         adjustLayout: true,
    38.         fontFamily: 'Georgia',
    39.         fontSize: 20,
    40.         mediaRules: [{
    41.             maxWidth: 500,
    42.             text: 'Crosshairs at 500 pixels',
    43.             fontSize: 14
    44.           },
    45.           {
    46.             maxWidth: 300,
    47.             text: 'Crosshairs at 300 pixels',
    48.             fontSize: 12,
    49.             fontWeight: 'normal'
    50.           }
    51.         ]
    52.       },
    53.       crosshairX: {
    54.         plotLabel: {
    55.           multiple: true,
    56.           fontFamily: 'Georgia',
    57.           backgroundColor: 'white',
    58.           alpha: 0.8,
    59.           padding: '5%',
    60.           borderRadius: '3px',
    61.         },
    62.         scaleLabel: {
    63.           fontFamily: 'Georgia',
    64.           borderRadius: '3px'
    65.         },
    66.         mediaRules: [{
    67.             maxWidth: 500,
    68.             plotLabel: {
    69.               fontFamily: 'Arial'
    70.             },
    71.             scaleLabel: {
    72.               fontFamily: 'Arial'
    73.             }
    74.           },
    75.           {
    76.             maxWidth: 300,
    77.             plotLabel: {
    78.               fontColor: 'black',
    79.               fontSize: 10,
    80.               padding: 2
    81.             },
    82.             scaleLabel: {
    83.               fontSize: 10,
    84.               padding: 2
    85.             }
    86.           }
    87.         ]
    88.       },
    89.       scaleX: {
    90.         minValue: 1435741200000, //07/01/15
    91.         maxValue: 1451638800000, //01/01/16
    92.         step: 'day',
    93.         transform: {
    94.           type: 'date',
    95.           all: '%m/%d'
    96.         },
    97.         itemsOverlap: true,
    98.         maxItems: 7,
    99.         item: {
    100.           fontSize: 10
    101.         },
    102.         guide: {
    103.           visible: true,
    104.           lineStyle: 'dotted'
    105.         }
    106.       },
    107.       scaleY: {
    108.         values: '400:700:300',
    109.         format: '$%v',
    110.         item: {
    111.           fontSize: 10
    112.         },
    113.         guide: {
    114.           lineStyle: 'dotted'
    115.         },
    116.         offsetStart: '50%',
    117.       },
    118.       scaleY2: {
    119.         values: '0:30:30',
    120.         format: '%vM',
    121.         item: {
    122.           fontSize: 10
    123.         },
    124.         guide: {
    125.           lineStyle: 'dotted'
    126.         },
    127.         placement: 'default',
    128.         blended: true,
    129.         offsetEnd: '70%',
    130.  
    131.       },
    132.       plot: {
    133.         tooltip: {
    134.           visible: false
    135.         }
    136.       },
    137.       plotarea: {
    138.         adjustLayout: true,
    139.         backgroundColor: '#f0f0f5',
    140.         alpha: 0.5
    141.       },
    142.       series: [{
    143.           type: 'line',
    144.           scales: 'scaleX,scaleY',
    145.           lineWidth: 1,
    146.           lineColor: '#666699',
    147.           marker: {
    148.             visible: false
    149.           },
    150.           guideLabel: {
    151.             text: 'Stock: $%v',
    152.             decimals: 2,
    153.             borderColor: '#666699',
    154.             mediaRules: [{
    155.                 maxWidth: 500,
    156.                 text: 'Stock:<br>$%v',
    157.                 textAlign: 'center'
    158.               },
    159.               {
    160.                 maxWidth: 300,
    161.                 text: '$%v'
    162.               }
    163.             ]
    164.           },
    165.           values: [
    166.             [1435741200000, 437.39], //07/01/15
    167.             [1435827600000, 437.71], //07/02/15
    168.  
    169.             [1436173200000, 436.04], //07/06/15
    170.             [1436259600000, 436.72], //07/07/15
    171.             [1436346000000, 429.70], //07/08/15
    172.             [1436432400000, 434.39], //07/09/15
    173.             [1436518800000, 443.51], //07/10/15
    174.  
    175.             [1436778000000, 455.57], //07/13/15
    176.             [1436864400000, 465.57], //07/14/15
    177.             [1436950800000, 461.19], //07/15/15
    178.             [1437037200000, 475.48], //07/16/15
    179.             [1437123600000, 483.01], //07/17/15
    180.  
    181.             [1437382800000, 488.10], //07/20/15
    182.             [1437469200000, 488.00], //07/21/15
    183.             [1437555600000, 488.27], //07/22/15
    184.             [1437642000000, 482.18], //07/23/15
    185.             [1437728400000, 529.42], //07/24/15
    186.  
    187.             [1437987600000, 531.41], //07/27/15
    188.             [1438074000000, 526.03], //07/28/15
    189.             [1438160400000, 529.00], //07/29/15
    190.             [1438246800000, 536.76], //07/30/15
    191.             [1438333200000, 536.15], //07/31/15
    192.  
    193.             [1438592400000, 535.03], //08/03/15
    194.             [1438678800000, 531.90], //08/04/15
    195.             [1438765200000, 537.01], //08/05/15
    196.             [1438851600000, 529.46], //08/06/15
    197.             [1438938000000, 522.62], //08/07/15
    198.  
    199.             [1439197200000, 524.00], //08/10/15
    200.             [1439283600000, 527.46], //08/11/15
    201.             [1439370000000, 525.91], //08/12/15
    202.             [1439456400000, 529.66], //08/13/15
    203.             [1439542800000, 531.52], //08/14/15
    204.  
    205.             [1439802000000, 535.22], //08/17/15
    206.             [1439888400000, 535.02], //08/18/15
    207.             [1439974800000, 532.92], //08/19/15
    208.             [1440061200000, 515.78], //08/20/15
    209.             [1440147600000, 494.47], //08/21/15
    210.  
    211.             [1440406800000, 463.37], //08/24/15
    212.             [1440493200000, 466.37], //08/25/15
    213.             [1440579600000, 500.77], //08/26/15
    214.             [1440666000000, 518.37], //08/27/15
    215.             [1440752400000, 518.01], //08/28/15
    216.  
    217.             [1441011600000, 512.89], //08/31/15
    218.             [1441098000000, 496.54], //09/01/15
    219.             [1441184400000, 510.55], //09/02/15
    220.             [1441270800000, 504.72], //09/03/15
    221.             [1441357200000, 499.00], //09/04/15
    222.  
    223.             [1441702800000, 517.54], //09/08/15
    224.             [1441789200000, 516.89], //09/09/15
    225.             [1441875600000, 522.24], //09/10/15
    226.             [1441962000000, 529.44], //09/11/15
    227.  
    228.             [1442221200000, 521.38], //09/14/15
    229.             [1442307600000, 522.37], //09/15/15
    230.             [1442394000000, 527.39], //09/16/15
    231.             [1442480400000, 538.87], //09/17/15
    232.             [1442566800000, 540.26], //09/18/15
    233.  
    234.             [1442826000000, 548.39], //09/21/15
    235.             [1442912400000, 538.40], //09/22/15
    236.             [1442998800000, 536.07], //09/23/15
    237.             [1443085200000, 533.75], //09/24/15
    238.             [1443171600000, 524.25], //09/25/15
    239.  
    240.             [1443430800000, 504.06], //09/28/15
    241.             [1443517200000, 496.07], //09/29/15
    242.             [1443603600000, 511.89], //09/30/15
    243.             [1443690000000, 520.72], //10/01/15
    244.             [1443776400000, 532.54], //10/02/15
    245.  
    246.             [1444035600000, 543.68], //10/05/15
    247.             [1444122000000, 537.48], //10/06/15
    248.             [1444208400000, 541.94], //10/07/15
    249.             [1444294800000, 533.16], //10/08/15
    250.             [1444381200000, 539.80], //10/09/15
    251.  
    252.             [1444640400000, 550.19], //10/12/15
    253.             [1444726800000, 548.90], //10/13/15
    254.             [1444813200000, 544.83], //10/14/15
    255.             [1444899600000, 562.44], //10/15/15
    256.             [1444986000000, 570.76], //10/16/15
    257.  
    258.             [1445245200000, 573.15], //10/19/15
    259.             [1445331600000, 560.88], //10/20/15
    260.             [1445418000000, 555.77], //10/21/15
    261.             [1445504400000, 565.91], //10/22/15
    262.             [1445590800000, 599.03], //10/23/15
    263.  
    264.             [1445850000000, 608.61], //10/26/15
    265.             [1445936400000, 611.01], //10/27/15
    266.             [1446022800000, 617.10], //10/28/15
    267.             [1446109200000, 626.55], //10/29/15
    268.             [1446195600000, 625.90], //10/30/15
    269.  
    270.             [1446454800000, 628.35], //11/02/15
    271.             [1446541200000, 625.31], //11/03/15
    272.             [1446627600000, 640.95], //11/04/15
    273.             [1446714000000, 655.65], //11/05/15
    274.             [1446800400000, 659.37], //11/06/15
    275.  
    276.             [1447059600000, 655.49], //11/09/15
    277.             [1447146000000, 659.68], //11/10/15
    278.             [1447232400000, 673.25], //11/11/15
    279.             [1447318800000, 665.60], //11/12/15
    280.             [1447405200000, 642.35], //11/13/15
    281.  
    282.             [1447664400000, 647.81], //11/16/15
    283.             [1447750800000, 643.30], //11/17/15
    284.             [1447837200000, 663.54], //11/18/15
    285.             [1447923600000, 661.27], //11/19/15
    286.             [1448010000000, 668.45], //11/20/15
    287.  
    288.             [1448269200000, 678.99], //11/23/15
    289.             [1448355600000, 671.15], //11/24/15
    290.             [1448442000000, 675.34], //11/25/15
    291.  
    292.             [1448614800000, 673.26], //11/27/15
    293.  
    294.             [1448874000000, 664.80], //11/30/15
    295.             [1448960400000, 679.06], //12/01/15
    296.             [1449046800000, 676.01], //12/02/15
    297.             [1449133200000, 666.25], //12/03/15
    298.             [1449219600000, 672.64], //12/04/15
    299.  
    300.             [1449478800000, 669.83], //12/07/15
    301.             [1449565200000, 677.33], //12/08/15
    302.             [1449651600000, 664.79], //12/09/15
    303.             [1449738000000, 662.32], //12/10/15
    304.             [1449824400000, 640.15], //12/11/15
    305.  
    306.             [1450083600000, 657.91], //12/14/15
    307.             [1450170000000, 658.64], //12/15/15
    308.             [1450256400000, 675.77], //12/16/15
    309.             [1450342800000, 670.65], //12/17/15
    310.             [1450429200000, 664.14], //12/18/15
    311.  
    312.             [1450688400000, 664.51], //12/21/15
    313.             [1450774800000, 663.15], //12/22/15
    314.             [1450861200000, 663.70], //12/23/15
    315.             [1450947600000, 662.79], //12/24/15
    316.  
    317.             [1451293200000, 675.20], //12/28/15
    318.             [1451379600000, 693.97], //12/29/15
    319.             [1451466000000, 689.07], //12/30/15
    320.             [1451552400000, 675.89], //12/31/15
    321.           ]
    322.         },
    323.         {
    324.           type: 'bar',
    325.           scales: 'scaleX,scaleY2',
    326.           barWidth: '50%',
    327.           backgroundColor: '#3d3d5c',
    328.           guideLabel: {
    329.             text: 'Volume: %vM',
    330.             borderColor: '#3d3d5c',
    331.             mediaRules: [{
    332.                 maxWidth: 500,
    333.                 text: 'Volume:<br>%vM',
    334.                 textAlign: 'center'
    335.               },
    336.               {
    337.                 maxWidth: 300,
    338.                 text: '%vM'
    339.               }
    340.             ]
    341.           },
    342.           values: [
    343.             [1435741200000, 1.99], //07/01/15
    344.             [1435827600000, 1.34], //07/02/15
    345.  
    346.             [1436173200000, 1.90], //07/06/15
    347.             [1436259600000, 3.45], //07/07/15
    348.             [1436346000000, 2.38], //07/08/15
    349.             [1436432400000, 2.27], //07/09/15
    350.             [1436518800000, 2.40], //07/10/15
    351.  
    352.             [1436778000000, 3.96], //07/13/15
    353.             [1436864400000, 4.74], //07/14/15
    354.             [1436950800000, 2.99], //07/15/15
    355.             [1437037200000, 4.10], //07/16/15
    356.             [1437123600000, 4.93], //07/17/15
    357.  
    358.             [1437382800000, 4.75], //07/20/15
    359.             [1437469200000, 3.18], //07/21/15
    360.             [1437555600000, 3.11], //07/22/15
    361.             [1437642000000, 9.37], //07/23/15
    362.             [1437728400000, 21.91], //07/24/15
    363.  
    364.             [1437987600000, 7.49], //07/27/15
    365.             [1438074000000, 5.27], //07/28/15
    366.             [1438160400000, 3.75], //07/29/15
    367.             [1438246800000, 3.74], //07/30/15
    368.             [1438333200000, 3.03], //07/31/15
    369.  
    370.             [1438592400000, 3.01], //08/03/15
    371.             [1438678800000, 2.93], //08/04/15
    372.             [1438765200000, 2.89], //08/05/15
    373.             [1438851600000, 3.82], //08/06/15
    374.             [1438938000000, 3.97], //08/07/15
    375.  
    376.             [1439197200000, 2.62], //08/10/15
    377.             [1439283600000, 2.68], //08/11/15
    378.             [1439370000000, 4.01], //08/12/15
    379.             [1439456400000, 2.90], //08/13/15
    380.             [1439542800000, 1.99], //08/14/15
    381.  
    382.             [1439802000000, 2.58], //08/17/15
    383.             [1439888400000, 2.07], //08/18/15
    384.             [1439974800000, 2.32], //08/19/15
    385.             [1440061200000, 4.41], //08/20/15
    386.             [1440147600000, 6.71], //08/21/15
    387.  
    388.             [1440406800000, 10.10], //08/24/15
    389.             [1440493200000, 5.68], //08/25/15
    390.             [1440579600000, 6.36], //08/26/15
    391.             [1440666000000, 6.11], //08/27/15
    392.             [1440752400000, 2.75], //08/28/15
    393.  
    394.             [1441011600000, 3.00], //08/31/15
    395.             [1441098000000, 3.86], //09/01/15
    396.             [1441184400000, 3.71], //09/02/15
    397.             [1441270800000, 3.15], //09/03/15
    398.             [1441357200000, 2.69], //09/04/15
    399.  
    400.             [1441702800000, 3.81], //09/08/15
    401.             [1441789200000, 4.37], //09/09/15
    402.             [1441875600000, 2.58], //09/10/15
    403.             [1441962000000, 3.23], //09/11/15
    404.  
    405.             [1442221200000, 3.13], //09/14/15
    406.             [1442307600000, 2.87], //09/15/15
    407.             [1442394000000, 2.25], //09/16/15
    408.             [1442480400000, 4.17], //09/17/15
    409.             [1442566800000, 6.16], //09/18/15
    410.  
    411.             [1442826000000, 3.28], //09/21/15
    412.             [1442912400000, 3.84], //09/22/15
    413.             [1442998800000, 2.24], //09/23/15
    414.             [1443085200000, 3.50], //09/24/15
    415.             [1443171600000, 4.03], //09/25/15
    416.  
    417.             [1443430800000, 5.43], //09/28/15
    418.             [1443517200000, 4.46], //09/29/15
    419.             [1443603600000, 4.00], //09/30/15
    420.             [1443690000000, 3.77], //10/01/15
    421.             [1443776400000, 4.60], //10/02/15
    422.  
    423.             [1444035600000, 3.39], //10/05/15
    424.             [1444122000000, 4.55], //10/06/15
    425.             [1444208400000, 3.81], //10/07/15
    426.             [1444294800000, 4.68], //10/08/15
    427.             [1444381200000, 3.54], //10/09/15
    428.  
    429.             [1444640400000, 2.78], //10/12/15
    430.             [1444726800000, 2.94], //10/13/15
    431.             [1444813200000, 3.58], //10/14/15
    432.             [1444899600000, 4.94], //10/15/15
    433.             [1444986000000, 4.32], //10/16/15
    434.  
    435.             [1445245200000, 4.38], //10/19/15
    436.             [1445331600000, 4.35], //10/20/15
    437.             [1445418000000, 3.36], //10/21/15
    438.             [1445504400000, 7.78], //10/22/15
    439.             [1445590800000, 10.69], //10/23/15
    440.  
    441.             [1445850000000, 4.27], //10/26/15
    442.             [1445936400000, 3.79], //10/27/15
    443.             [1446022800000, 3.93], //10/28/15
    444.             [1446109200000, 3.90], //10/29/15
    445.             [1446195600000, 3.87], //10/30/15
    446.  
    447.             [1446454800000, 2.82], //11/02/15
    448.             [1446541200000, 3.25], //11/03/15
    449.             [1446627600000, 4.84], //11/04/15
    450.             [1446714000000, 4.72], //11/05/15
    451.             [1446800400000, 4.09], //11/06/15
    452.  
    453.             [1447059600000, 4.05], //11/09/15
    454.             [1447146000000, 3.49], //11/10/15
    455.             [1447232400000, 5.39], //11/11/15
    456.             [1447318800000, 4.28], //11/12/15
    457.             [1447405200000, 6.26], //11/13/15
    458.  
    459.             [1447664400000, 7.44], //11/16/15
    460.             [1447750800000, 4.32], //11/17/15
    461.             [1447837200000, 4.47], //11/18/15
    462.             [1447923600000, 4.71], //11/19/15
    463.             [1448010000000, 3.90], //11/20/15
    464.  
    465.             [1448269200000, 4.39], //11/23/15
    466.             [1448355600000, 4.54], //11/24/15
    467.             [1448442000000, 2.70], //11/25/15
    468.  
    469.             [1448614800000, 1.97], //11/27/15
    470.  
    471.             [1448874000000, 5.69], //11/30/15
    472.             [1448960400000, 4.75], //12/01/15
    473.             [1449046800000, 4.27], //12/02/15
    474.             [1449133200000, 5.06], //12/03/15
    475.             [1449219600000, 4.53], //12/04/15
    476.  
    477.             [1449478800000, 3.73], //12/07/15
    478.             [1449565200000, 3.65], //12/08/15
    479.             [1449651600000, 5.16], //12/09/15
    480.             [1449738000000, 3.46], //12/10/15
    481.             [1449824400000, 5.47], //12/11/15
    482.  
    483.             [1450083600000, 4.36], //12/14/15
    484.             [1450170000000, 4.75], //12/15/15
    485.             [1450256400000, 3.96], //12/16/15
    486.             [1450342800000, 3.68], //12/17/15
    487.             [1450429200000, 6.84], //12/18/15
    488.  
    489.             [1450688400000, 3.25], //12/21/15
    490.             [1450774800000, 2.67], //12/22/15
    491.             [1450861200000, 2.72], //12/23/15
    492.             [1450947600000, 1.09], //12/24/15
    493.  
    494.             [1451293200000, 3.78], //12/28/15
    495.             [1451379600000, 5.73], //12/29/15
    496.             [1451466000000, 3.52], //12/30/15
    497.             [1451552400000, 3.75], //12/31/15
    498.           ]
    499.         }
    500.       ]
    501.     };
    502.  
    503.     // adjust the refresh rate of the chart
    504.     zingchart.DEV.RESIZESPEED = 50;
    505.     zingchart.DEV.DEBOUNCESPEED = 50;
    506.  
    507.     zingchart.render({
    508.       id: 'myChart',
    509.       data: chartConfig,
    510.       height: '100%',
    511.       width: '100%'
    512.     });
    513.  
    514.     // initiate jquery resizable container for demo purposes
    515.     $('.container').resizable();
    516.   </script>
    517. </body>
    518.  
    519. </html>
    1. <!DOCTYPE html>
    2. <html>
    3.  
    4. <head>
    5.   <meta charset="utf-8">
    6.   <title>ZingSoft Demo</title>
    7.   <script src='//code.jquery.com/jquery-2.1.4.min.js'></script>
    8.   <script src='//code.jquery.com/ui/1.11.4/jquery-ui.min.js'></script>
    9.   <link rel='stylesheet' href='//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css'>
    10.  
    11.   <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
    12. </head>
    13.  
    14. <body>
    15.   <div class='container'>
    16.     <div id='myChart'></div>
    17.   </div>
    18. </body>
    19.  
    20. </html>
    1. .container {
    2.   width: 400px;
    3.   height: 200px;
    4.   min-width: 400px;
    5.   border: 1px dashed #777;
    6. }
    7.  
    8. #myChart {
    9.   width: 100%;
    10.   height: 100%;
    11. }
    1. let chartConfig = {
    2.   type: 'mixed',
    3.   title: {
    4.     text: 'Crosshairs at 100% width',
    5.     adjustLayout: true,
    6.     fontFamily: 'Georgia',
    7.     fontSize: 20,
    8.     mediaRules: [{
    9.         maxWidth: 500,
    10.         text: 'Crosshairs at 500 pixels',
    11.         fontSize: 14
    12.       },
    13.       {
    14.         maxWidth: 300,
    15.         text: 'Crosshairs at 300 pixels',
    16.         fontSize: 12,
    17.         fontWeight: 'normal'
    18.       }
    19.     ]
    20.   },
    21.   crosshairX: {
    22.     plotLabel: {
    23.       multiple: true,
    24.       fontFamily: 'Georgia',
    25.       backgroundColor: 'white',
    26.       alpha: 0.8,
    27.       padding: '5%',
    28.       borderRadius: '3px',
    29.     },
    30.     scaleLabel: {
    31.       fontFamily: 'Georgia',
    32.       borderRadius: '3px'
    33.     },
    34.     mediaRules: [{
    35.         maxWidth: 500,
    36.         plotLabel: {
    37.           fontFamily: 'Arial'
    38.         },
    39.         scaleLabel: {
    40.           fontFamily: 'Arial'
    41.         }
    42.       },
    43.       {
    44.         maxWidth: 300,
    45.         plotLabel: {
    46.           fontColor: 'black',
    47.           fontSize: 10,
    48.           padding: 2
    49.         },
    50.         scaleLabel: {
    51.           fontSize: 10,
    52.           padding: 2
    53.         }
    54.       }
    55.     ]
    56.   },
    57.   scaleX: {
    58.     minValue: 1435741200000, //07/01/15
    59.     maxValue: 1451638800000, //01/01/16
    60.     step: 'day',
    61.     transform: {
    62.       type: 'date',
    63.       all: '%m/%d'
    64.     },
    65.     itemsOverlap: true,
    66.     maxItems: 7,
    67.     item: {
    68.       fontSize: 10
    69.     },
    70.     guide: {
    71.       visible: true,
    72.       lineStyle: 'dotted'
    73.     }
    74.   },
    75.   scaleY: {
    76.     values: '400:700:300',
    77.     format: '$%v',
    78.     item: {
    79.       fontSize: 10
    80.     },
    81.     guide: {
    82.       lineStyle: 'dotted'
    83.     },
    84.     offsetStart: '50%',
    85.   },
    86.   scaleY2: {
    87.     values: '0:30:30',
    88.     format: '%vM',
    89.     item: {
    90.       fontSize: 10
    91.     },
    92.     guide: {
    93.       lineStyle: 'dotted'
    94.     },
    95.     placement: 'default',
    96.     blended: true,
    97.     offsetEnd: '70%',
    98.  
    99.   },
    100.   plot: {
    101.     tooltip: {
    102.       visible: false
    103.     }
    104.   },
    105.   plotarea: {
    106.     adjustLayout: true,
    107.     backgroundColor: '#f0f0f5',
    108.     alpha: 0.5
    109.   },
    110.   series: [{
    111.       type: 'line',
    112.       scales: 'scaleX,scaleY',
    113.       lineWidth: 1,
    114.       lineColor: '#666699',
    115.       marker: {
    116.         visible: false
    117.       },
    118.       guideLabel: {
    119.         text: 'Stock: $%v',
    120.         decimals: 2,
    121.         borderColor: '#666699',
    122.         mediaRules: [{
    123.             maxWidth: 500,
    124.             text: 'Stock:<br>$%v',
    125.             textAlign: 'center'
    126.           },
    127.           {
    128.             maxWidth: 300,
    129.             text: '$%v'
    130.           }
    131.         ]
    132.       },
    133.       values: [
    134.         [1435741200000, 437.39], //07/01/15
    135.         [1435827600000, 437.71], //07/02/15
    136.  
    137.         [1436173200000, 436.04], //07/06/15
    138.         [1436259600000, 436.72], //07/07/15
    139.         [1436346000000, 429.70], //07/08/15
    140.         [1436432400000, 434.39], //07/09/15
    141.         [1436518800000, 443.51], //07/10/15
    142.  
    143.         [1436778000000, 455.57], //07/13/15
    144.         [1436864400000, 465.57], //07/14/15
    145.         [1436950800000, 461.19], //07/15/15
    146.         [1437037200000, 475.48], //07/16/15
    147.         [1437123600000, 483.01], //07/17/15
    148.  
    149.         [1437382800000, 488.10], //07/20/15
    150.         [1437469200000, 488.00], //07/21/15
    151.         [1437555600000, 488.27], //07/22/15
    152.         [1437642000000, 482.18], //07/23/15
    153.         [1437728400000, 529.42], //07/24/15
    154.  
    155.         [1437987600000, 531.41], //07/27/15
    156.         [1438074000000, 526.03], //07/28/15
    157.         [1438160400000, 529.00], //07/29/15
    158.         [1438246800000, 536.76], //07/30/15
    159.         [1438333200000, 536.15], //07/31/15
    160.  
    161.         [1438592400000, 535.03], //08/03/15
    162.         [1438678800000, 531.90], //08/04/15
    163.         [1438765200000, 537.01], //08/05/15
    164.         [1438851600000, 529.46], //08/06/15
    165.         [1438938000000, 522.62], //08/07/15
    166.  
    167.         [1439197200000, 524.00], //08/10/15
    168.         [1439283600000, 527.46], //08/11/15
    169.         [1439370000000, 525.91], //08/12/15
    170.         [1439456400000, 529.66], //08/13/15
    171.         [1439542800000, 531.52], //08/14/15
    172.  
    173.         [1439802000000, 535.22], //08/17/15
    174.         [1439888400000, 535.02], //08/18/15
    175.         [1439974800000, 532.92], //08/19/15
    176.         [1440061200000, 515.78], //08/20/15
    177.         [1440147600000, 494.47], //08/21/15
    178.  
    179.         [1440406800000, 463.37], //08/24/15
    180.         [1440493200000, 466.37], //08/25/15
    181.         [1440579600000, 500.77], //08/26/15
    182.         [1440666000000, 518.37], //08/27/15
    183.         [1440752400000, 518.01], //08/28/15
    184.  
    185.         [1441011600000, 512.89], //08/31/15
    186.         [1441098000000, 496.54], //09/01/15
    187.         [1441184400000, 510.55], //09/02/15
    188.         [1441270800000, 504.72], //09/03/15
    189.         [1441357200000, 499.00], //09/04/15
    190.  
    191.         [1441702800000, 517.54], //09/08/15
    192.         [1441789200000, 516.89], //09/09/15
    193.         [1441875600000, 522.24], //09/10/15
    194.         [1441962000000, 529.44], //09/11/15
    195.  
    196.         [1442221200000, 521.38], //09/14/15
    197.         [1442307600000, 522.37], //09/15/15
    198.         [1442394000000, 527.39], //09/16/15
    199.         [1442480400000, 538.87], //09/17/15
    200.         [1442566800000, 540.26], //09/18/15
    201.  
    202.         [1442826000000, 548.39], //09/21/15
    203.         [1442912400000, 538.40], //09/22/15
    204.         [1442998800000, 536.07], //09/23/15
    205.         [1443085200000, 533.75], //09/24/15
    206.         [1443171600000, 524.25], //09/25/15
    207.  
    208.         [1443430800000, 504.06], //09/28/15
    209.         [1443517200000, 496.07], //09/29/15
    210.         [1443603600000, 511.89], //09/30/15
    211.         [1443690000000, 520.72], //10/01/15
    212.         [1443776400000, 532.54], //10/02/15
    213.  
    214.         [1444035600000, 543.68], //10/05/15
    215.         [1444122000000, 537.48], //10/06/15
    216.         [1444208400000, 541.94], //10/07/15
    217.         [1444294800000, 533.16], //10/08/15
    218.         [1444381200000, 539.80], //10/09/15
    219.  
    220.         [1444640400000, 550.19], //10/12/15
    221.         [1444726800000, 548.90], //10/13/15
    222.         [1444813200000, 544.83], //10/14/15
    223.         [1444899600000, 562.44], //10/15/15
    224.         [1444986000000, 570.76], //10/16/15
    225.  
    226.         [1445245200000, 573.15], //10/19/15
    227.         [1445331600000, 560.88], //10/20/15
    228.         [1445418000000, 555.77], //10/21/15
    229.         [1445504400000, 565.91], //10/22/15
    230.         [1445590800000, 599.03], //10/23/15
    231.  
    232.         [1445850000000, 608.61], //10/26/15
    233.         [1445936400000, 611.01], //10/27/15
    234.         [1446022800000, 617.10], //10/28/15
    235.         [1446109200000, 626.55], //10/29/15
    236.         [1446195600000, 625.90], //10/30/15
    237.  
    238.         [1446454800000, 628.35], //11/02/15
    239.         [1446541200000, 625.31], //11/03/15
    240.         [1446627600000, 640.95], //11/04/15
    241.         [1446714000000, 655.65], //11/05/15
    242.         [1446800400000, 659.37], //11/06/15
    243.  
    244.         [1447059600000, 655.49], //11/09/15
    245.         [1447146000000, 659.68], //11/10/15
    246.         [1447232400000, 673.25], //11/11/15
    247.         [1447318800000, 665.60], //11/12/15
    248.         [1447405200000, 642.35], //11/13/15
    249.  
    250.         [1447664400000, 647.81], //11/16/15
    251.         [1447750800000, 643.30], //11/17/15
    252.         [1447837200000, 663.54], //11/18/15
    253.         [1447923600000, 661.27], //11/19/15
    254.         [1448010000000, 668.45], //11/20/15
    255.  
    256.         [1448269200000, 678.99], //11/23/15
    257.         [1448355600000, 671.15], //11/24/15
    258.         [1448442000000, 675.34], //11/25/15
    259.  
    260.         [1448614800000, 673.26], //11/27/15
    261.  
    262.         [1448874000000, 664.80], //11/30/15
    263.         [1448960400000, 679.06], //12/01/15
    264.         [1449046800000, 676.01], //12/02/15
    265.         [1449133200000, 666.25], //12/03/15
    266.         [1449219600000, 672.64], //12/04/15
    267.  
    268.         [1449478800000, 669.83], //12/07/15
    269.         [1449565200000, 677.33], //12/08/15
    270.         [1449651600000, 664.79], //12/09/15
    271.         [1449738000000, 662.32], //12/10/15
    272.         [1449824400000, 640.15], //12/11/15
    273.  
    274.         [1450083600000, 657.91], //12/14/15
    275.         [1450170000000, 658.64], //12/15/15
    276.         [1450256400000, 675.77], //12/16/15
    277.         [1450342800000, 670.65], //12/17/15
    278.         [1450429200000, 664.14], //12/18/15
    279.  
    280.         [1450688400000, 664.51], //12/21/15
    281.         [1450774800000, 663.15], //12/22/15
    282.         [1450861200000, 663.70], //12/23/15
    283.         [1450947600000, 662.79], //12/24/15
    284.  
    285.         [1451293200000, 675.20], //12/28/15
    286.         [1451379600000, 693.97], //12/29/15
    287.         [1451466000000, 689.07], //12/30/15
    288.         [1451552400000, 675.89], //12/31/15
    289.       ]
    290.     },
    291.     {
    292.       type: 'bar',
    293.       scales: 'scaleX,scaleY2',
    294.       barWidth: '50%',
    295.       backgroundColor: '#3d3d5c',
    296.       guideLabel: {
    297.         text: 'Volume: %vM',
    298.         borderColor: '#3d3d5c',
    299.         mediaRules: [{
    300.             maxWidth: 500,
    301.             text: 'Volume:<br>%vM',
    302.             textAlign: 'center'
    303.           },
    304.           {
    305.             maxWidth: 300,
    306.             text: '%vM'
    307.           }
    308.         ]
    309.       },
    310.       values: [
    311.         [1435741200000, 1.99], //07/01/15
    312.         [1435827600000, 1.34], //07/02/15
    313.  
    314.         [1436173200000, 1.90], //07/06/15
    315.         [1436259600000, 3.45], //07/07/15
    316.         [1436346000000, 2.38], //07/08/15
    317.         [1436432400000, 2.27], //07/09/15
    318.         [1436518800000, 2.40], //07/10/15
    319.  
    320.         [1436778000000, 3.96], //07/13/15
    321.         [1436864400000, 4.74], //07/14/15
    322.         [1436950800000, 2.99], //07/15/15
    323.         [1437037200000, 4.10], //07/16/15
    324.         [1437123600000, 4.93], //07/17/15
    325.  
    326.         [1437382800000, 4.75], //07/20/15
    327.         [1437469200000, 3.18], //07/21/15
    328.         [1437555600000, 3.11], //07/22/15
    329.         [1437642000000, 9.37], //07/23/15
    330.         [1437728400000, 21.91], //07/24/15
    331.  
    332.         [1437987600000, 7.49], //07/27/15
    333.         [1438074000000, 5.27], //07/28/15
    334.         [1438160400000, 3.75], //07/29/15
    335.         [1438246800000, 3.74], //07/30/15
    336.         [1438333200000, 3.03], //07/31/15
    337.  
    338.         [1438592400000, 3.01], //08/03/15
    339.         [1438678800000, 2.93], //08/04/15
    340.         [1438765200000, 2.89], //08/05/15
    341.         [1438851600000, 3.82], //08/06/15
    342.         [1438938000000, 3.97], //08/07/15
    343.  
    344.         [1439197200000, 2.62], //08/10/15
    345.         [1439283600000, 2.68], //08/11/15
    346.         [1439370000000, 4.01], //08/12/15
    347.         [1439456400000, 2.90], //08/13/15
    348.         [1439542800000, 1.99], //08/14/15
    349.  
    350.         [1439802000000, 2.58], //08/17/15
    351.         [1439888400000, 2.07], //08/18/15
    352.         [1439974800000, 2.32], //08/19/15
    353.         [1440061200000, 4.41], //08/20/15
    354.         [1440147600000, 6.71], //08/21/15
    355.  
    356.         [1440406800000, 10.10], //08/24/15
    357.         [1440493200000, 5.68], //08/25/15
    358.         [1440579600000, 6.36], //08/26/15
    359.         [1440666000000, 6.11], //08/27/15
    360.         [1440752400000, 2.75], //08/28/15
    361.  
    362.         [1441011600000, 3.00], //08/31/15
    363.         [1441098000000, 3.86], //09/01/15
    364.         [1441184400000, 3.71], //09/02/15
    365.         [1441270800000, 3.15], //09/03/15
    366.         [1441357200000, 2.69], //09/04/15
    367.  
    368.         [1441702800000, 3.81], //09/08/15
    369.         [1441789200000, 4.37], //09/09/15
    370.         [1441875600000, 2.58], //09/10/15
    371.         [1441962000000, 3.23], //09/11/15
    372.  
    373.         [1442221200000, 3.13], //09/14/15
    374.         [1442307600000, 2.87], //09/15/15
    375.         [1442394000000, 2.25], //09/16/15
    376.         [1442480400000, 4.17], //09/17/15
    377.         [1442566800000, 6.16], //09/18/15
    378.  
    379.         [1442826000000, 3.28], //09/21/15
    380.         [1442912400000, 3.84], //09/22/15
    381.         [1442998800000, 2.24], //09/23/15
    382.         [1443085200000, 3.50], //09/24/15
    383.         [1443171600000, 4.03], //09/25/15
    384.  
    385.         [1443430800000, 5.43], //09/28/15
    386.         [1443517200000, 4.46], //09/29/15
    387.         [1443603600000, 4.00], //09/30/15
    388.         [1443690000000, 3.77], //10/01/15
    389.         [1443776400000, 4.60], //10/02/15
    390.  
    391.         [1444035600000, 3.39], //10/05/15
    392.         [1444122000000, 4.55], //10/06/15
    393.         [1444208400000, 3.81], //10/07/15
    394.         [1444294800000, 4.68], //10/08/15
    395.         [1444381200000, 3.54], //10/09/15
    396.  
    397.         [1444640400000, 2.78], //10/12/15
    398.         [1444726800000, 2.94], //10/13/15
    399.         [1444813200000, 3.58], //10/14/15
    400.         [1444899600000, 4.94], //10/15/15
    401.         [1444986000000, 4.32], //10/16/15
    402.  
    403.         [1445245200000, 4.38], //10/19/15
    404.         [1445331600000, 4.35], //10/20/15
    405.         [1445418000000, 3.36], //10/21/15
    406.         [1445504400000, 7.78], //10/22/15
    407.         [1445590800000, 10.69], //10/23/15
    408.  
    409.         [1445850000000, 4.27], //10/26/15
    410.         [1445936400000, 3.79], //10/27/15
    411.         [1446022800000, 3.93], //10/28/15
    412.         [1446109200000, 3.90], //10/29/15
    413.         [1446195600000, 3.87], //10/30/15
    414.  
    415.         [1446454800000, 2.82], //11/02/15
    416.         [1446541200000, 3.25], //11/03/15
    417.         [1446627600000, 4.84], //11/04/15
    418.         [1446714000000, 4.72], //11/05/15
    419.         [1446800400000, 4.09], //11/06/15
    420.  
    421.         [1447059600000, 4.05], //11/09/15
    422.         [1447146000000, 3.49], //11/10/15
    423.         [1447232400000, 5.39], //11/11/15
    424.         [1447318800000, 4.28], //11/12/15
    425.         [1447405200000, 6.26], //11/13/15
    426.  
    427.         [1447664400000, 7.44], //11/16/15
    428.         [1447750800000, 4.32], //11/17/15
    429.         [1447837200000, 4.47], //11/18/15
    430.         [1447923600000, 4.71], //11/19/15
    431.         [1448010000000, 3.90], //11/20/15
    432.  
    433.         [1448269200000, 4.39], //11/23/15
    434.         [1448355600000, 4.54], //11/24/15
    435.         [1448442000000, 2.70], //11/25/15
    436.  
    437.         [1448614800000, 1.97], //11/27/15
    438.  
    439.         [1448874000000, 5.69], //11/30/15
    440.         [1448960400000, 4.75], //12/01/15
    441.         [1449046800000, 4.27], //12/02/15
    442.         [1449133200000, 5.06], //12/03/15
    443.         [1449219600000, 4.53], //12/04/15
    444.  
    445.         [1449478800000, 3.73], //12/07/15
    446.         [1449565200000, 3.65], //12/08/15
    447.         [1449651600000, 5.16], //12/09/15
    448.         [1449738000000, 3.46], //12/10/15
    449.         [1449824400000, 5.47], //12/11/15
    450.  
    451.         [1450083600000, 4.36], //12/14/15
    452.         [1450170000000, 4.75], //12/15/15
    453.         [1450256400000, 3.96], //12/16/15
    454.         [1450342800000, 3.68], //12/17/15
    455.         [1450429200000, 6.84], //12/18/15
    456.  
    457.         [1450688400000, 3.25], //12/21/15
    458.         [1450774800000, 2.67], //12/22/15
    459.         [1450861200000, 2.72], //12/23/15
    460.         [1450947600000, 1.09], //12/24/15
    461.  
    462.         [1451293200000, 3.78], //12/28/15
    463.         [1451379600000, 5.73], //12/29/15
    464.         [1451466000000, 3.52], //12/30/15
    465.         [1451552400000, 3.75], //12/31/15
    466.       ]
    467.     }
    468.   ]
    469. };
    470.  
    471. // adjust the refresh rate of the chart
    472. zingchart.DEV.RESIZESPEED = 50;
    473. zingchart.DEV.DEBOUNCESPEED = 50;
    474.  
    475. zingchart.render({
    476.   id: 'myChart',
    477.   data: chartConfig,
    478.   height: '100%',
    479.   width: '100%'
    480. });
    481.  
    482. // initiate jquery resizable container for demo purposes
    483. $('.container').resizable();