• 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='http://cdn.zingchart.com/zingchart.min.js'></script>
    8.  
    9.   <script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
    10.   <style></style>
    11. </head>
    12.  
    13. <body>
    14.   <div id='myChart'></div>
    15.   <script>
    16.     ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];
    17.     var kstheme1 = {
    18.       "root": {
    19.         "background-color": "white",
    20.         "gui": {
    21.           "context-menu": {
    22.             "button": {
    23.               "visible": false
    24.             },
    25.             "gear": {
    26.               "visible": false
    27.             }
    28.           }
    29.         }
    30.       },
    31.       "palette": {
    32.         "mixed": [
    33.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    34.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    35.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    36.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    37.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    38.         ],
    39.         "vbar": [
    40.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    41.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    42.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    43.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    44.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    45.         ],
    46.         "vbar3d": [
    47.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    48.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    49.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    50.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    51.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    52.         ],
    53.         "hbar": [
    54.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    55.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    56.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    57.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    58.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    59.         ],
    60.         "hbar3d": [
    61.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    62.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    63.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    64.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    65.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    66.         ],
    67.         "pie": [
    68.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    69.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    70.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    71.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    72.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    73.         ],
    74.         "pie3d": [
    75.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    76.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    77.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    78.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    79.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    80.         ],
    81.         "nestedpie": [
    82.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    83.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    84.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    85.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    86.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    87.         ],
    88.         "area": [
    89.           ["#9fdff5", "#40beeb", "#40beeb", "#40beeb"],
    90.           ["#97afb9", "#305f74", "#305f74", "#305f74"],
    91.           ["#a1c9d3", "#4492a8", "#4492a8", "#4492a8"],
    92.           ["#c7c7c7", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    93.           ["#c2dee6", "#85bdcd", "#85bdcd", "#85bdcd"]
    94.         ],
    95.         "area3d": [
    96.           ["#9fdff5", "#40beeb", "#40beeb", "#40beeb"],
    97.           ["#97afb9", "#305f74", "#305f74", "#305f74"],
    98.           ["#a1c9d3", "#4492a8", "#4492a8", "#4492a8"],
    99.           ["#c7c7c7", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    100.           ["#c2dee6", "#85bdcd", "#85bdcd", "#85bdcd"]
    101.         ],
    102.         "gauge": [
    103.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    104.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    105.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    106.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    107.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    108.         ],
    109.         "line": [
    110.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    111.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    112.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    113.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    114.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    115.         ],
    116.         "line3d": [
    117.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    118.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    119.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    120.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    121.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    122.         ],
    123.         "piano": [
    124.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    125.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    126.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    127.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    128.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    129.         ],
    130.         "vbullet": [
    131.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    132.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    133.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    134.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    135.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    136.         ],
    137.         "hbullet": [
    138.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    139.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    140.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    141.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    142.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    143.         ],
    144.         "vfunnel": [
    145.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    146.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    147.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    148.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    149.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    150.         ],
    151.         "hfunnel": [
    152.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    153.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    154.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    155.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    156.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    157.         ],
    158.         "scatter": [
    159.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    160.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    161.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    162.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    163.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    164.         ],
    165.         "radar": [
    166.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    167.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    168.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    169.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    170.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    171.         ],
    172.         "venn": [
    173.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    174.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    175.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    176.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    177.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    178.         ],
    179.         "chord": [
    180.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    181.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    182.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    183.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    184.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    185.         ],
    186.         "treemap": [
    187.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    188.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    189.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    190.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    191.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    192.         ],
    193.         "wordcloud": [
    194.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    195.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    196.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    197.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    198.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    199.         ],
    200.         "stock": [
    201.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    202.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    203.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    204.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    205.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    206.         ],
    207.         "bubble": [
    208.           ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    209.           ["#ffffff", "#305f74", "#305f74", "#305f74"],
    210.           ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    211.           ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    212.           ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    213.         ]
    214.       },
    215.  
    216.  
    217.       "graph": {
    218.         "background-color": "none",
    219.         "border-color": "#ddd",
    220.         "border-width": "1px",
    221.         "border-style": "solid",
    222.         "borderRadius": "5",
    223.         "title": {
    224.           "background-color": "#ddd",
    225.           "height": "28px",
    226.           "align": "left",
    227.           "fontColor": "#333333",
    228.           "borderRadiusTopLeft": "5",
    229.           "borderRadiusTopRight": "5"
    230.         },
    231.         "legend": {
    232.           "header": {
    233.             "background-color": "#333333",
    234.             "borderColor": "-1",
    235.             "borderRadiusTopLeft": "5",
    236.             "borderRadiusTopRight": "5"
    237.           },
    238.           "borderRadius": "5",
    239.           "borderColor": "#333333",
    240.           "item": {
    241.             "markerStyle": "circle",
    242.             "fontColor": "#333333",
    243.             "borderColor": "#1bc9f2",
    244.             "lineColor": "#333333"
    245.           }
    246.         },
    247.  
    248.         "scale-x": {
    249.           "lineColor": "#151515",
    250.           "fontColor": "#333333",
    251.           "tick": {
    252.             "lineColor": "#dddddd",
    253.             "line-width": "1px"
    254.           },
    255.           "guide": {
    256.             "line-width": "1px",
    257.             "line-color": "#ccc",
    258.             "line-style": "solid"
    259.           },
    260.           "item": {
    261.             "fontColor": "#333333"
    262.           }
    263.         },
    264.         "scale-y": {
    265.           "lineColor": "#151515",
    266.           "fontColor": "#333333",
    267.           "label": {
    268.             "fontColor": "#333333"
    269.           },
    270.           "guide": {
    271.             "line-width": "1px",
    272.             "line-color": "#ccc",
    273.             "line-style": "solid"
    274.           },
    275.           "tick": {
    276.             "lineColor": "#dddddd",
    277.             "line-width": "1px"
    278.           },
    279.           "item": {
    280.             "fontColor": "#333333"
    281.           }
    282.         },
    283.         "source": {
    284.           "fontColor": "#333333"
    285.         }
    286.       },
    287.  
    288.       "line": {
    289.         "plot": {
    290.           "lineWidth": 1,
    291.           "marker": {
    292.             "visible": true
    293.           },
    294.           "animate": false,
    295.           "effect": 4,
    296.           "speed": 100,
    297.           "tooltip-text": "%v"
    298.         },
    299.         "scale-x": {
    300.           "markers": {
    301.             "backgroundColor": "#1bc9f2",
    302.             "lineColor": "#947850"
    303.           }
    304.         }
    305.       },
    306.  
    307.       "area": {
    308.         "tooltip": {
    309.           "color": "white"
    310.         },
    311.         "plot": {
    312.           "animate": false,
    313.           "effect": 1,
    314.           "speed": "100",
    315.           "lineWidth": 1,
    316.           "tooltip-text": "%v",
    317.           "aspect": "spline"
    318.         }
    319.       },
    320.  
    321.       "gauge": {
    322.         "scale-r": {
    323.           "tick": {
    324.             "lineColor": "#333333"
    325.           },
    326.           "item": {
    327.             "fontColor": "#333333"
    328.           }
    329.         }
    330.       },
    331.       "pie3d": {
    332.         "plotarea": {
    333.           "margin-top": "10%",
    334.           "margin-bottom": "10%",
    335.           "margin-left": "12%",
    336.           "margin-right": "10%"
    337.         }
    338.       },
    339.       "pie": {
    340.         "plot": {
    341.           "effect": 3,
    342.           "highlight": true,
    343.           "value-box": {
    344.             "type": "all",
    345.             "placement": "out",
    346.             "backgroundTransparent": true,
    347.             "text": "%t\n"
    348.           }
    349.         }
    350.       }
    351.     };
    352.     var myJson = {
    353.       "graphset": [{
    354.         "type": "pie",
    355.         "title": {
    356.           "text": "Palette Example"
    357.         },
    358.         "series": [{
    359.             "values": [35]
    360.           },
    361.           {
    362.             "values": [66]
    363.           },
    364.           {
    365.             "values": [55]
    366.           },
    367.           {
    368.             "values": [4]
    369.           }
    370.         ]
    371.       }]
    372.     };
    373.     zingchart.render({
    374.       id: 'myChart',
    375.       data: myJson,
    376.       height: 400,
    377.       width: '100%',
    378.       defaults: kstheme1
    379.     });
    380.   </script>
    381. </body>
    382.  
    383. </html>
    1. <!DOCTYPE html>
    2. <html>
    3.  
    4. <head>
    5.   <meta charset="utf-8">
    6.   <title>ZingSoft Demo</title>
    7.   <script src='http://cdn.zingchart.com/zingchart.min.js'></script>
    8.  
    9.   <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
    10. </head>
    11.  
    12. <body>
    13.   <div id='myChart'></div>
    14. </body>
    15.  
    16. </html>
    1.  
    1. var kstheme1 = {
    2.   "root": {
    3.     "background-color": "white",
    4.     "gui": {
    5.       "context-menu": {
    6.         "button": {
    7.           "visible": false
    8.         },
    9.         "gear": {
    10.           "visible": false
    11.         }
    12.       }
    13.     }
    14.   },
    15.   "palette": {
    16.     "mixed": [
    17.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    18.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    19.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    20.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    21.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    22.     ],
    23.     "vbar": [
    24.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    25.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    26.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    27.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    28.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    29.     ],
    30.     "vbar3d": [
    31.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    32.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    33.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    34.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    35.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    36.     ],
    37.     "hbar": [
    38.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    39.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    40.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    41.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    42.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    43.     ],
    44.     "hbar3d": [
    45.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    46.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    47.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    48.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    49.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    50.     ],
    51.     "pie": [
    52.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    53.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    54.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    55.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    56.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    57.     ],
    58.     "pie3d": [
    59.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    60.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    61.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    62.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    63.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    64.     ],
    65.     "nestedpie": [
    66.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    67.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    68.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    69.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    70.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    71.     ],
    72.     "area": [
    73.       ["#9fdff5", "#40beeb", "#40beeb", "#40beeb"],
    74.       ["#97afb9", "#305f74", "#305f74", "#305f74"],
    75.       ["#a1c9d3", "#4492a8", "#4492a8", "#4492a8"],
    76.       ["#c7c7c7", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    77.       ["#c2dee6", "#85bdcd", "#85bdcd", "#85bdcd"]
    78.     ],
    79.     "area3d": [
    80.       ["#9fdff5", "#40beeb", "#40beeb", "#40beeb"],
    81.       ["#97afb9", "#305f74", "#305f74", "#305f74"],
    82.       ["#a1c9d3", "#4492a8", "#4492a8", "#4492a8"],
    83.       ["#c7c7c7", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    84.       ["#c2dee6", "#85bdcd", "#85bdcd", "#85bdcd"]
    85.     ],
    86.     "gauge": [
    87.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    88.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    89.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    90.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    91.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    92.     ],
    93.     "line": [
    94.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    95.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    96.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    97.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    98.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    99.     ],
    100.     "line3d": [
    101.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    102.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    103.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    104.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    105.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    106.     ],
    107.     "piano": [
    108.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    109.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    110.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    111.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    112.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    113.     ],
    114.     "vbullet": [
    115.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    116.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    117.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    118.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    119.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    120.     ],
    121.     "hbullet": [
    122.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    123.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    124.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    125.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    126.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    127.     ],
    128.     "vfunnel": [
    129.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    130.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    131.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    132.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    133.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    134.     ],
    135.     "hfunnel": [
    136.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    137.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    138.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    139.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    140.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    141.     ],
    142.     "scatter": [
    143.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    144.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    145.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    146.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    147.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    148.     ],
    149.     "radar": [
    150.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    151.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    152.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    153.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    154.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    155.     ],
    156.     "venn": [
    157.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    158.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    159.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    160.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    161.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    162.     ],
    163.     "chord": [
    164.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    165.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    166.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    167.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    168.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    169.     ],
    170.     "treemap": [
    171.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    172.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    173.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    174.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    175.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    176.     ],
    177.     "wordcloud": [
    178.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    179.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    180.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    181.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    182.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    183.     ],
    184.     "stock": [
    185.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    186.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    187.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    188.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    189.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    190.     ],
    191.     "bubble": [
    192.       ["#ffffff", "#40beeb", "#40beeb", "#40beeb"],
    193.       ["#ffffff", "#305f74", "#305f74", "#305f74"],
    194.       ["#ffffff", "#4492a8", "#4492a8", "#4492a8"],
    195.       ["#ffffff", "#8e8e8e", "#8e8e8e", "#8e8e8e"],
    196.       ["#ffffff", "#85bdcd", "#85bdcd", "#85bdcd"]
    197.     ]
    198.   },
    199.  
    200.  
    201.   "graph": {
    202.     "background-color": "none",
    203.     "border-color": "#ddd",
    204.     "border-width": "1px",
    205.     "border-style": "solid",
    206.     "borderRadius": "5",
    207.     "title": {
    208.       "background-color": "#ddd",
    209.       "height": "28px",
    210.       "align": "left",
    211.       "fontColor": "#333333",
    212.       "borderRadiusTopLeft": "5",
    213.       "borderRadiusTopRight": "5"
    214.     },
    215.     "legend": {
    216.       "header": {
    217.         "background-color": "#333333",
    218.         "borderColor": "-1",
    219.         "borderRadiusTopLeft": "5",
    220.         "borderRadiusTopRight": "5"
    221.       },
    222.       "borderRadius": "5",
    223.       "borderColor": "#333333",
    224.       "item": {
    225.         "markerStyle": "circle",
    226.         "fontColor": "#333333",
    227.         "borderColor": "#1bc9f2",
    228.         "lineColor": "#333333"
    229.       }
    230.     },
    231.  
    232.     "scale-x": {
    233.       "lineColor": "#151515",
    234.       "fontColor": "#333333",
    235.       "tick": {
    236.         "lineColor": "#dddddd",
    237.         "line-width": "1px"
    238.       },
    239.       "guide": {
    240.         "line-width": "1px",
    241.         "line-color": "#ccc",
    242.         "line-style": "solid"
    243.       },
    244.       "item": {
    245.         "fontColor": "#333333"
    246.       }
    247.     },
    248.     "scale-y": {
    249.       "lineColor": "#151515",
    250.       "fontColor": "#333333",
    251.       "label": {
    252.         "fontColor": "#333333"
    253.       },
    254.       "guide": {
    255.         "line-width": "1px",
    256.         "line-color": "#ccc",
    257.         "line-style": "solid"
    258.       },
    259.       "tick": {
    260.         "lineColor": "#dddddd",
    261.         "line-width": "1px"
    262.       },
    263.       "item": {
    264.         "fontColor": "#333333"
    265.       }
    266.     },
    267.     "source": {
    268.       "fontColor": "#333333"
    269.     }
    270.   },
    271.  
    272.   "line": {
    273.     "plot": {
    274.       "lineWidth": 1,
    275.       "marker": {
    276.         "visible": true
    277.       },
    278.       "animate": false,
    279.       "effect": 4,
    280.       "speed": 100,
    281.       "tooltip-text": "%v"
    282.     },
    283.     "scale-x": {
    284.       "markers": {
    285.         "backgroundColor": "#1bc9f2",
    286.         "lineColor": "#947850"
    287.       }
    288.     }
    289.   },
    290.  
    291.   "area": {
    292.     "tooltip": {
    293.       "color": "white"
    294.     },
    295.     "plot": {
    296.       "animate": false,
    297.       "effect": 1,
    298.       "speed": "100",
    299.       "lineWidth": 1,
    300.       "tooltip-text": "%v",
    301.       "aspect": "spline"
    302.     }
    303.   },
    304.  
    305.   "gauge": {
    306.     "scale-r": {
    307.       "tick": {
    308.         "lineColor": "#333333"
    309.       },
    310.       "item": {
    311.         "fontColor": "#333333"
    312.       }
    313.     }
    314.   },
    315.   "pie3d": {
    316.     "plotarea": {
    317.       "margin-top": "10%",
    318.       "margin-bottom": "10%",
    319.       "margin-left": "12%",
    320.       "margin-right": "10%"
    321.     }
    322.   },
    323.   "pie": {
    324.     "plot": {
    325.       "effect": 3,
    326.       "highlight": true,
    327.       "value-box": {
    328.         "type": "all",
    329.         "placement": "out",
    330.         "backgroundTransparent": true,
    331.         "text": "%t\n"
    332.       }
    333.     }
    334.   }
    335. };
    336. var myJson = {
    337.   "graphset": [{
    338.     "type": "pie",
    339.     "title": {
    340.       "text": "Palette Example"
    341.     },
    342.     "series": [{
    343.         "values": [35]
    344.       },
    345.       {
    346.         "values": [66]
    347.       },
    348.       {
    349.         "values": [55]
    350.       },
    351.       {
    352.         "values": [4]
    353.       }
    354.     ]
    355.   }]
    356. };
    357. zingchart.render({
    358.   id: 'myChart',
    359.   data: myJson,
    360.   height: 400,
    361.   width: '100%',
    362.   defaults: kstheme1
    363. });