• Edit
  • Download
    1. <!DOCTYPE html>
    2. <html>
    3.  
    4. <head>
    5.   <meta charset="utf-8">
    6.   <title>ZingSoft Demo</title>
    7.  
    8.   <script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
    9.   <style></style>
    10. </head>
    11.  
    12. <body>
    13.   <div id='myChart'></div>
    14.   <script>
    15.     ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];
    16.     zingchart.loadModules('maps, maps-usa', function(e) {
    17.       zingchart.render({
    18.         id: 'myChart',
    19.         data: {
    20.           shapes: [{
    21.             type: 'zingchart.maps',
    22.             options: {
    23.               name: 'usa',
    24.               style: {
    25.                 items: {
    26.  
    27.                   //Northeast:
    28.                   CT: {
    29.                     group: 1,
    30.                     backgroundColor: '#FFCDD2',
    31.                     hoverState: {
    32.                       backgroundColor: '#EF9A9A'
    33.                     }
    34.                   },
    35.                   ME: {
    36.                     group: 1,
    37.                     backgroundColor: '#FFCDD2',
    38.                     hoverState: {
    39.                       backgroundColor: '#EF9A9A'
    40.                     },
    41.                     bottomState: {
    42.                       backgroundColor: 'red',
    43.                       offsetX: 20,
    44.                       offsetY: 20,
    45.                     }
    46.                   },
    47.                   MA: {
    48.                     group: 1,
    49.                     backgroundColor: '#FFCDD2',
    50.                     hoverState: {
    51.                       backgroundColor: '#EF9A9A'
    52.                     }
    53.                   },
    54.                   NH: {
    55.                     group: 1,
    56.                     backgroundColor: '#FFCDD2',
    57.                     hoverState: {
    58.                       backgroundColor: '#EF9A9A'
    59.                     }
    60.                   },
    61.                   RI: {
    62.                     group: 1,
    63.                     backgroundColor: '#FFCDD2',
    64.                     hoverState: {
    65.                       backgroundColor: '#EF9A9A'
    66.                     }
    67.                   },
    68.                   VT: {
    69.                     group: 1,
    70.                     backgroundColor: '#FFCDD2',
    71.                     hoverState: {
    72.                       backgroundColor: '#EF9A9A'
    73.                     }
    74.                   },
    75.                   DE: {
    76.                     group: 1,
    77.                     backgroundColor: '#FFCDD2',
    78.                     hoverState: {
    79.                       backgroundColor: '#EF9A9A'
    80.                     }
    81.                   },
    82.                   NJ: {
    83.                     group: 1,
    84.                     backgroundColor: '#FFCDD2',
    85.                     hoverState: {
    86.                       backgroundColor: '#EF9A9A'
    87.                     }
    88.                   },
    89.                   NY: {
    90.                     group: 1,
    91.                     backgroundColor: '#FFCDD2',
    92.                     hoverState: {
    93.                       backgroundColor: '#EF9A9A'
    94.                     }
    95.                   },
    96.                   PA: {
    97.                     group: 1,
    98.                     backgroundColor: '#FFCDD2',
    99.                     hoverState: {
    100.                       backgroundColor: '#EF9A9A'
    101.                     }
    102.                   },
    103.  
    104.                   //Midwest:
    105.                   IL: {
    106.                     group: 2,
    107.                     backgroundColor: '#FFE0B2',
    108.                     hoverState: {
    109.                       backgroundColor: '#FFB74D'
    110.                     }
    111.                   },
    112.                   IN: {
    113.                     group: 2,
    114.                     backgroundColor: '#FFE0B2',
    115.                     hoverState: {
    116.                       backgroundColor: '#FFB74D'
    117.                     }
    118.                   },
    119.                   MI: {
    120.                     group: 2,
    121.                     backgroundColor: '#FFE0B2',
    122.                     hoverState: {
    123.                       backgroundColor: '#FFB74D'
    124.                     }
    125.                   },
    126.                   OH: {
    127.                     group: 2,
    128.                     backgroundColor: '#FFE0B2',
    129.                     hoverState: {
    130.                       backgroundColor: '#FFB74D'
    131.                     }
    132.                   },
    133.                   WI: {
    134.                     group: 2,
    135.                     backgroundColor: '#FFE0B2',
    136.                     hoverState: {
    137.                       backgroundColor: '#FFB74D'
    138.                     }
    139.                   },
    140.                   IA: {
    141.                     group: 2,
    142.                     backgroundColor: '#FFE0B2',
    143.                     hoverState: {
    144.                       backgroundColor: '#FFB74D'
    145.                     }
    146.                   },
    147.                   KS: {
    148.                     group: 2,
    149.                     backgroundColor: '#FFE0B2',
    150.                     hoverState: {
    151.                       backgroundColor: '#FFB74D'
    152.                     }
    153.                   },
    154.                   MN: {
    155.                     group: 2,
    156.                     backgroundColor: '#FFE0B2',
    157.                     hoverState: {
    158.                       backgroundColor: '#FFB74D'
    159.                     }
    160.                   },
    161.                   MO: {
    162.                     group: 2,
    163.                     backgroundColor: '#FFE0B2',
    164.                     hoverState: {
    165.                       backgroundColor: '#FFB74D'
    166.                     }
    167.                   },
    168.                   NE: {
    169.                     group: 2,
    170.                     backgroundColor: '#FFE0B2',
    171.                     hoverState: {
    172.                       backgroundColor: '#FFB74D'
    173.                     }
    174.                   },
    175.                   ND: {
    176.                     group: 2,
    177.                     backgroundColor: '#FFE0B2',
    178.                     hoverState: {
    179.                       backgroundColor: '#FFB74D'
    180.                     }
    181.                   },
    182.                   SD: {
    183.                     group: 2,
    184.                     backgroundColor: '#FFE0B2',
    185.                     hoverState: {
    186.                       backgroundColor: '#FFB74D'
    187.                     }
    188.                   },
    189.  
    190.                   //South:
    191.                   FL: {
    192.                     group: 3,
    193.                     backgroundColor: '#C8E6C9',
    194.                     hoverState: {
    195.                       backgroundColor: '#81C784'
    196.                     }
    197.                   },
    198.                   GA: {
    199.                     group: 3,
    200.                     backgroundColor: '#C8E6C9',
    201.                     hoverState: {
    202.                       backgroundColor: '#81C784'
    203.                     }
    204.                   },
    205.                   MD: {
    206.                     group: 3,
    207.                     backgroundColor: '#C8E6C9',
    208.                     hoverState: {
    209.                       backgroundColor: '#81C784'
    210.                     }
    211.                   },
    212.                   NC: {
    213.                     group: 3,
    214.                     backgroundColor: '#C8E6C9',
    215.                     hoverState: {
    216.                       backgroundColor: '#81C784'
    217.                     }
    218.                   },
    219.                   SC: {
    220.                     group: 3,
    221.                     backgroundColor: '#C8E6C9',
    222.                     hoverState: {
    223.                       backgroundColor: '#81C784'
    224.                     }
    225.                   },
    226.                   VA: {
    227.                     group: 3,
    228.                     backgroundColor: '#C8E6C9',
    229.                     hoverState: {
    230.                       backgroundColor: '#81C784'
    231.                     }
    232.                   },
    233.                   DC: {
    234.                     group: 3,
    235.                     backgroundColor: '#C8E6C9',
    236.                     hoverState: {
    237.                       backgroundColor: '#81C784'
    238.                     }
    239.                   },
    240.                   WV: {
    241.                     group: 3,
    242.                     backgroundColor: '#C8E6C9',
    243.                     hoverState: {
    244.                       backgroundColor: '#81C784'
    245.                     }
    246.                   },
    247.                   AL: {
    248.                     group: 3,
    249.                     backgroundColor: '#C8E6C9',
    250.                     hoverState: {
    251.                       backgroundColor: '#81C784'
    252.                     }
    253.                   },
    254.                   KY: {
    255.                     group: 3,
    256.                     backgroundColor: '#C8E6C9',
    257.                     hoverState: {
    258.                       backgroundColor: '#81C784'
    259.                     }
    260.                   },
    261.                   MS: {
    262.                     group: 3,
    263.                     backgroundColor: '#C8E6C9',
    264.                     hoverState: {
    265.                       backgroundColor: '#81C784'
    266.                     }
    267.                   },
    268.                   TN: {
    269.                     group: 3,
    270.                     backgroundColor: '#C8E6C9',
    271.                     hoverState: {
    272.                       backgroundColor: '#81C784'
    273.                     }
    274.                   },
    275.                   AR: {
    276.                     group: 3,
    277.                     backgroundColor: '#C8E6C9',
    278.                     hoverState: {
    279.                       backgroundColor: '#81C784'
    280.                     }
    281.                   },
    282.                   LA: {
    283.                     group: 3,
    284.                     backgroundColor: '#C8E6C9',
    285.                     hoverState: {
    286.                       backgroundColor: '#81C784'
    287.                     }
    288.                   },
    289.                   OK: {
    290.                     group: 3,
    291.                     backgroundColor: '#C8E6C9',
    292.                     hoverState: {
    293.                       backgroundColor: '#81C784'
    294.                     }
    295.                   },
    296.                   TX: {
    297.                     group: 3,
    298.                     backgroundColor: '#C8E6C9',
    299.                     hoverState: {
    300.                       backgroundColor: '#81C784'
    301.                     }
    302.                   },
    303.  
    304.                   //West:
    305.                   AZ: {
    306.                     group: 4,
    307.                     backgroundColor: '#BBDEFB',
    308.                     hoverState: {
    309.                       backgroundColor: '#64B5F6'
    310.                     }
    311.                   },
    312.                   CO: {
    313.                     group: 4,
    314.                     backgroundColor: '#BBDEFB',
    315.                     hoverState: {
    316.                       backgroundColor: '#64B5F6'
    317.                     }
    318.                   },
    319.                   ID: {
    320.                     group: 4,
    321.                     backgroundColor: '#BBDEFB',
    322.                     hoverState: {
    323.                       backgroundColor: '#64B5F6'
    324.                     }
    325.                   },
    326.                   MT: {
    327.                     group: 4,
    328.                     backgroundColor: '#BBDEFB',
    329.                     hoverState: {
    330.                       backgroundColor: '#64B5F6'
    331.                     }
    332.                   },
    333.                   NV: {
    334.                     group: 4,
    335.                     backgroundColor: '#BBDEFB',
    336.                     hoverState: {
    337.                       backgroundColor: '#64B5F6'
    338.                     }
    339.                   },
    340.                   NM: {
    341.                     group: 4,
    342.                     backgroundColor: '#BBDEFB',
    343.                     hoverState: {
    344.                       backgroundColor: '#64B5F6'
    345.                     }
    346.                   },
    347.                   UT: {
    348.                     group: 4,
    349.                     backgroundColor: '#BBDEFB',
    350.                     hoverState: {
    351.                       backgroundColor: '#64B5F6'
    352.                     }
    353.                   },
    354.                   WY: {
    355.                     group: 4,
    356.                     backgroundColor: '#BBDEFB',
    357.                     hoverState: {
    358.                       backgroundColor: '#64B5F6'
    359.                     }
    360.                   },
    361.                   AK: {
    362.                     group: 4,
    363.                     backgroundColor: '#BBDEFB',
    364.                     hoverState: {
    365.                       backgroundColor: '#64B5F6'
    366.                     }
    367.                   },
    368.                   CA: {
    369.                     group: 4,
    370.                     backgroundColor: '#BBDEFB',
    371.                     hoverState: {
    372.                       backgroundColor: '#64B5F6'
    373.                     }
    374.                   },
    375.                   HI: {
    376.                     group: 4,
    377.                     backgroundColor: '#BBDEFB',
    378.                     hoverState: {
    379.                       backgroundColor: '#64B5F6'
    380.                     }
    381.                   },
    382.                   OR: {
    383.                     group: 4,
    384.                     backgroundColor: '#BBDEFB',
    385.                     hoverState: {
    386.                       backgroundColor: '#64B5F6'
    387.                     }
    388.                   },
    389.                   WA: {
    390.                     group: 4,
    391.                     backgroundColor: '#BBDEFB',
    392.                     hoverState: {
    393.                       backgroundColor: '#64B5F6'
    394.                     }
    395.                   }
    396.                 },
    397.                 tooltip: {
    398.                   alpha: 0.5,
    399.                   backgroundColor: 'white',
    400.                   borderColor: 'white',
    401.                   borderRadius: 3,
    402.                   fontColor: 'black',
    403.                   fontFamily: 'Georgia',
    404.                   fontSize: 12,
    405.                   textAlpha: 1
    406.                 }
    407.               }
    408.             }
    409.           }]
    410.         },
    411.         height: 400,
    412.         width: '100%'
    413.       });
    414.     });
    415.   </script>
    416. </body>
    417.  
    418. </html>
    1. <!DOCTYPE html>
    2. <html>
    3.  
    4. <head>
    5.   <meta charset="utf-8">
    6.   <title>ZingSoft Demo</title>
    7.  
    8.   <script src="https://cdn.zingchart.com/zingchart.min.js"></script>
    9. </head>
    10.  
    11. <body>
    12.   <div id='myChart'></div>
    13. </body>
    14.  
    15. </html>
    1.  
    1. zingchart.loadModules('maps, maps-usa', function(e) {
    2.   zingchart.render({
    3.     id: 'myChart',
    4.     data: {
    5.       shapes: [{
    6.         type: 'zingchart.maps',
    7.         options: {
    8.           name: 'usa',
    9.           style: {
    10.             items: {
    11.  
    12.               //Northeast:
    13.               CT: {
    14.                 group: 1,
    15.                 backgroundColor: '#FFCDD2',
    16.                 hoverState: {
    17.                   backgroundColor: '#EF9A9A'
    18.                 }
    19.               },
    20.               ME: {
    21.                 group: 1,
    22.                 backgroundColor: '#FFCDD2',
    23.                 hoverState: {
    24.                   backgroundColor: '#EF9A9A'
    25.                 },
    26.                 bottomState: {
    27.                   backgroundColor: 'red',
    28.                   offsetX: 20,
    29.                   offsetY: 20,
    30.                 }
    31.               },
    32.               MA: {
    33.                 group: 1,
    34.                 backgroundColor: '#FFCDD2',
    35.                 hoverState: {
    36.                   backgroundColor: '#EF9A9A'
    37.                 }
    38.               },
    39.               NH: {
    40.                 group: 1,
    41.                 backgroundColor: '#FFCDD2',
    42.                 hoverState: {
    43.                   backgroundColor: '#EF9A9A'
    44.                 }
    45.               },
    46.               RI: {
    47.                 group: 1,
    48.                 backgroundColor: '#FFCDD2',
    49.                 hoverState: {
    50.                   backgroundColor: '#EF9A9A'
    51.                 }
    52.               },
    53.               VT: {
    54.                 group: 1,
    55.                 backgroundColor: '#FFCDD2',
    56.                 hoverState: {
    57.                   backgroundColor: '#EF9A9A'
    58.                 }
    59.               },
    60.               DE: {
    61.                 group: 1,
    62.                 backgroundColor: '#FFCDD2',
    63.                 hoverState: {
    64.                   backgroundColor: '#EF9A9A'
    65.                 }
    66.               },
    67.               NJ: {
    68.                 group: 1,
    69.                 backgroundColor: '#FFCDD2',
    70.                 hoverState: {
    71.                   backgroundColor: '#EF9A9A'
    72.                 }
    73.               },
    74.               NY: {
    75.                 group: 1,
    76.                 backgroundColor: '#FFCDD2',
    77.                 hoverState: {
    78.                   backgroundColor: '#EF9A9A'
    79.                 }
    80.               },
    81.               PA: {
    82.                 group: 1,
    83.                 backgroundColor: '#FFCDD2',
    84.                 hoverState: {
    85.                   backgroundColor: '#EF9A9A'
    86.                 }
    87.               },
    88.  
    89.               //Midwest:
    90.               IL: {
    91.                 group: 2,
    92.                 backgroundColor: '#FFE0B2',
    93.                 hoverState: {
    94.                   backgroundColor: '#FFB74D'
    95.                 }
    96.               },
    97.               IN: {
    98.                 group: 2,
    99.                 backgroundColor: '#FFE0B2',
    100.                 hoverState: {
    101.                   backgroundColor: '#FFB74D'
    102.                 }
    103.               },
    104.               MI: {
    105.                 group: 2,
    106.                 backgroundColor: '#FFE0B2',
    107.                 hoverState: {
    108.                   backgroundColor: '#FFB74D'
    109.                 }
    110.               },
    111.               OH: {
    112.                 group: 2,
    113.                 backgroundColor: '#FFE0B2',
    114.                 hoverState: {
    115.                   backgroundColor: '#FFB74D'
    116.                 }
    117.               },
    118.               WI: {
    119.                 group: 2,
    120.                 backgroundColor: '#FFE0B2',
    121.                 hoverState: {
    122.                   backgroundColor: '#FFB74D'
    123.                 }
    124.               },
    125.               IA: {
    126.                 group: 2,
    127.                 backgroundColor: '#FFE0B2',
    128.                 hoverState: {
    129.                   backgroundColor: '#FFB74D'
    130.                 }
    131.               },
    132.               KS: {
    133.                 group: 2,
    134.                 backgroundColor: '#FFE0B2',
    135.                 hoverState: {
    136.                   backgroundColor: '#FFB74D'
    137.                 }
    138.               },
    139.               MN: {
    140.                 group: 2,
    141.                 backgroundColor: '#FFE0B2',
    142.                 hoverState: {
    143.                   backgroundColor: '#FFB74D'
    144.                 }
    145.               },
    146.               MO: {
    147.                 group: 2,
    148.                 backgroundColor: '#FFE0B2',
    149.                 hoverState: {
    150.                   backgroundColor: '#FFB74D'
    151.                 }
    152.               },
    153.               NE: {
    154.                 group: 2,
    155.                 backgroundColor: '#FFE0B2',
    156.                 hoverState: {
    157.                   backgroundColor: '#FFB74D'
    158.                 }
    159.               },
    160.               ND: {
    161.                 group: 2,
    162.                 backgroundColor: '#FFE0B2',
    163.                 hoverState: {
    164.                   backgroundColor: '#FFB74D'
    165.                 }
    166.               },
    167.               SD: {
    168.                 group: 2,
    169.                 backgroundColor: '#FFE0B2',
    170.                 hoverState: {
    171.                   backgroundColor: '#FFB74D'
    172.                 }
    173.               },
    174.  
    175.               //South:
    176.               FL: {
    177.                 group: 3,
    178.                 backgroundColor: '#C8E6C9',
    179.                 hoverState: {
    180.                   backgroundColor: '#81C784'
    181.                 }
    182.               },
    183.               GA: {
    184.                 group: 3,
    185.                 backgroundColor: '#C8E6C9',
    186.                 hoverState: {
    187.                   backgroundColor: '#81C784'
    188.                 }
    189.               },
    190.               MD: {
    191.                 group: 3,
    192.                 backgroundColor: '#C8E6C9',
    193.                 hoverState: {
    194.                   backgroundColor: '#81C784'
    195.                 }
    196.               },
    197.               NC: {
    198.                 group: 3,
    199.                 backgroundColor: '#C8E6C9',
    200.                 hoverState: {
    201.                   backgroundColor: '#81C784'
    202.                 }
    203.               },
    204.               SC: {
    205.                 group: 3,
    206.                 backgroundColor: '#C8E6C9',
    207.                 hoverState: {
    208.                   backgroundColor: '#81C784'
    209.                 }
    210.               },
    211.               VA: {
    212.                 group: 3,
    213.                 backgroundColor: '#C8E6C9',
    214.                 hoverState: {
    215.                   backgroundColor: '#81C784'
    216.                 }
    217.               },
    218.               DC: {
    219.                 group: 3,
    220.                 backgroundColor: '#C8E6C9',
    221.                 hoverState: {
    222.                   backgroundColor: '#81C784'
    223.                 }
    224.               },
    225.               WV: {
    226.                 group: 3,
    227.                 backgroundColor: '#C8E6C9',
    228.                 hoverState: {
    229.                   backgroundColor: '#81C784'
    230.                 }
    231.               },
    232.               AL: {
    233.                 group: 3,
    234.                 backgroundColor: '#C8E6C9',
    235.                 hoverState: {
    236.                   backgroundColor: '#81C784'
    237.                 }
    238.               },
    239.               KY: {
    240.                 group: 3,
    241.                 backgroundColor: '#C8E6C9',
    242.                 hoverState: {
    243.                   backgroundColor: '#81C784'
    244.                 }
    245.               },
    246.               MS: {
    247.                 group: 3,
    248.                 backgroundColor: '#C8E6C9',
    249.                 hoverState: {
    250.                   backgroundColor: '#81C784'
    251.                 }
    252.               },
    253.               TN: {
    254.                 group: 3,
    255.                 backgroundColor: '#C8E6C9',
    256.                 hoverState: {
    257.                   backgroundColor: '#81C784'
    258.                 }
    259.               },
    260.               AR: {
    261.                 group: 3,
    262.                 backgroundColor: '#C8E6C9',
    263.                 hoverState: {
    264.                   backgroundColor: '#81C784'
    265.                 }
    266.               },
    267.               LA: {
    268.                 group: 3,
    269.                 backgroundColor: '#C8E6C9',
    270.                 hoverState: {
    271.                   backgroundColor: '#81C784'
    272.                 }
    273.               },
    274.               OK: {
    275.                 group: 3,
    276.                 backgroundColor: '#C8E6C9',
    277.                 hoverState: {
    278.                   backgroundColor: '#81C784'
    279.                 }
    280.               },
    281.               TX: {
    282.                 group: 3,
    283.                 backgroundColor: '#C8E6C9',
    284.                 hoverState: {
    285.                   backgroundColor: '#81C784'
    286.                 }
    287.               },
    288.  
    289.               //West:
    290.               AZ: {
    291.                 group: 4,
    292.                 backgroundColor: '#BBDEFB',
    293.                 hoverState: {
    294.                   backgroundColor: '#64B5F6'
    295.                 }
    296.               },
    297.               CO: {
    298.                 group: 4,
    299.                 backgroundColor: '#BBDEFB',
    300.                 hoverState: {
    301.                   backgroundColor: '#64B5F6'
    302.                 }
    303.               },
    304.               ID: {
    305.                 group: 4,
    306.                 backgroundColor: '#BBDEFB',
    307.                 hoverState: {
    308.                   backgroundColor: '#64B5F6'
    309.                 }
    310.               },
    311.               MT: {
    312.                 group: 4,
    313.                 backgroundColor: '#BBDEFB',
    314.                 hoverState: {
    315.                   backgroundColor: '#64B5F6'
    316.                 }
    317.               },
    318.               NV: {
    319.                 group: 4,
    320.                 backgroundColor: '#BBDEFB',
    321.                 hoverState: {
    322.                   backgroundColor: '#64B5F6'
    323.                 }
    324.               },
    325.               NM: {
    326.                 group: 4,
    327.                 backgroundColor: '#BBDEFB',
    328.                 hoverState: {
    329.                   backgroundColor: '#64B5F6'
    330.                 }
    331.               },
    332.               UT: {
    333.                 group: 4,
    334.                 backgroundColor: '#BBDEFB',
    335.                 hoverState: {
    336.                   backgroundColor: '#64B5F6'
    337.                 }
    338.               },
    339.               WY: {
    340.                 group: 4,
    341.                 backgroundColor: '#BBDEFB',
    342.                 hoverState: {
    343.                   backgroundColor: '#64B5F6'
    344.                 }
    345.               },
    346.               AK: {
    347.                 group: 4,
    348.                 backgroundColor: '#BBDEFB',
    349.                 hoverState: {
    350.                   backgroundColor: '#64B5F6'
    351.                 }
    352.               },
    353.               CA: {
    354.                 group: 4,
    355.                 backgroundColor: '#BBDEFB',
    356.                 hoverState: {
    357.                   backgroundColor: '#64B5F6'
    358.                 }
    359.               },
    360.               HI: {
    361.                 group: 4,
    362.                 backgroundColor: '#BBDEFB',
    363.                 hoverState: {
    364.                   backgroundColor: '#64B5F6'
    365.                 }
    366.               },
    367.               OR: {
    368.                 group: 4,
    369.                 backgroundColor: '#BBDEFB',
    370.                 hoverState: {
    371.                   backgroundColor: '#64B5F6'
    372.                 }
    373.               },
    374.               WA: {
    375.                 group: 4,
    376.                 backgroundColor: '#BBDEFB',
    377.                 hoverState: {
    378.                   backgroundColor: '#64B5F6'
    379.                 }
    380.               }
    381.             },
    382.             tooltip: {
    383.               alpha: 0.5,
    384.               backgroundColor: 'white',
    385.               borderColor: 'white',
    386.               borderRadius: 3,
    387.               fontColor: 'black',
    388.               fontFamily: 'Georgia',
    389.               fontSize: 12,
    390.               textAlpha: 1
    391.             }
    392.           }
    393.         }
    394.       }]
    395.     },
    396.     height: 400,
    397.     width: '100%'
    398.   });
    399. });