<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ZingSoft Demo</title>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,800' rel='stylesheet' type='text/css'>
<script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
<style>
.chart--container {
height: 100%;
width: 100%;
min-height: 530px;
}
.zc-ref {
display: none;
}
</style>
</head>
<body>
<div id="myChart" class="chart--container"><a class="zc-ref" href="https://www.zingchart.com/">Powered by ZingChart</a></div>
<script>
ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];
let chartConfig = {
globals: {
fontFamily: 'Open Sans',
shadow: false
},
backgroundColor: '#FFF #CCC',
labels: [{
text: 'Each province is the color of the presiding<br>premiers political party colors. Hover over<br>a province to get more information about<br>the premier and their political party.',
padding: '5px 10px',
backgroundColor: '#FFF',
borderColor: '#333',
borderRadius: '4px',
borderWidth: '1px',
fontSize: '14px',
textAlign: 'left'
}],
shapes: [{
type: 'star5',
tooltip: {
text: 'Toronto',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '486px',
y: '448px'
},
{
type: 'star5',
tooltip: {
text: 'Quebec City',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '530px',
y: '420px'
},
{
type: 'star5',
tooltip: {
text: 'St. Johns',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '672px',
y: '414px'
},
{
type: 'star5',
tooltip: {
text: 'Fredericton',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '576px',
y: '428px'
},
{
type: 'star5',
tooltip: {
text: 'Halifax',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '596px',
y: '442px'
},
{
type: 'star5',
tooltip: {
text: 'Charlottetown',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '3px',
x: '599px',
y: '424px'
},
{
type: 'star5',
tooltip: {
text: 'Winnipeg',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '360px',
y: '380px'
},
{
type: 'star5',
tooltip: {
text: 'Saskatoon',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '295px',
y: '360px'
},
{
type: 'star5',
tooltip: {
text: 'Edmonton',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '242px',
y: '343px'
},
{
type: 'star5',
tooltip: {
text: 'Victoria',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '172px',
y: '402px'
},
{
type: 'star5',
tooltip: {
text: 'Whitehorse',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '91px',
y: '262px'
},
{
type: 'star5',
tooltip: {
text: 'Yellowknife',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '242px',
y: '250px'
},
{
type: 'star5',
tooltip: {
text: 'Iqaluit',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '562px',
y: '235px'
},
{
type: 'zingchart.maps',
options: {
id: 'map',
name: 'can',
scale: true,
style: {
controls: {
visible: false
},
items: {
AB: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(245,130,32);color:#FFF;>Alberta</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Rachel Notley<br><span style=font-weight:800;>Party</span>: New Democratic Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/rnotley.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(245,130,32)',
hoverState: {
backgroundColor: 'rgb(255,170,60)'
}
},
BC: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(55,113,169);color:#FFF;>British Columbia</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Christy Clark<br><span style=font-weight:800;>Party</span>: British Columbia Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/cclark.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(55,113,169)',
hoverState: {
backgroundColor: 'rgb(100,153,219)'
}
},
MB: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(245,130,32);color:#FFF;>Manitoba</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Greg Selinger<br><span style=font-weight:800;>Party</span>: New Democratic Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/gselinger.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(245,130,32)',
hoverState: {
backgroundColor: 'rgb(255,170,60)'
}
},
NB: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>New Brunswick</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Brian Gallant<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/bgallant.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
NF: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(0,50,160);color:#FFF;>Newfoundland & Labrador</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Paul Davis<br><span style=font-weight:800;>Party</span>: Progressive Conservative</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/pdavis.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(0,50,160)',
hoverState: {
backgroundColor: 'rgb(0,10,200)'
}
},
NS: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>Nova Scotia</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Stephen McNeil<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/smcneil.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
NT: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(100,100,100);color:#FFF;>Northwest Territories</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Bob McLeod<br><span style=font-weight:800;>Party</span>: Independent</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/bmcleod.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: '#ffffff',
backgroundImage: 'PATTERN_SHADE_50'
},
NU: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(50,50,50);color:#FFF;width:100%;>Nunavut</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Peter Taptuna<br><span style=font-weight:800;>Party</span>: Independent</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/ptaptuna.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: '#ffffff',
backgroundImage: 'PATTERN_SHADE_75'
},
ON: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>Ontario</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Kathleen Wynne<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/kwynne.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
PE: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>Prince Edward Island</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Wade MacLauchlan<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/wmachlauchlan.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
QC: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(0,122,194);color:#FFF;>Quebec</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Philippe Couillard<br><span style=font-weight:800;>Party</span>: Quebec Liberal Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/pcouillard.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(0,122,194)',
hoverState: {
backgroundColor: 'rgb(0,170,255)'
}
},
SK: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(1,81,68);color:#FFF;>Saskatchewan</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Brad Wall<br><span style=font-weight:800;>Party</span>: Saskatchewan Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/bwall.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(1,81,68)',
hoverState: {
backgroundColor: 'rgb(50,130,120)'
}
},
YT: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(14,92,153);color:#FFF;>Yukon</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Darrell Pasloski<br><span style=font-weight:800;>Party</span>: Yukon Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/dpasloski.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(14,92,153)',
hoverState: {
backgroundColor: 'rgb(54,152,253)'
}
}
},
label: {
alpha: 0
},
shadow: true
},
width: '100%',
height: '100%',
x: '0px',
y: '0px'
}
}
]
};
zingchart.loadModules('maps,maps-can,patterns');
zingchart.render({
id: 'myChart',
data: chartConfig,
height: '100%',
width: '725',
});
</script>
</body>
</html>
let chartConfig = {
globals: {
fontFamily: 'Open Sans',
shadow: false
},
backgroundColor: '#FFF #CCC',
labels: [
{
text: 'Each province is the color of the presiding<br>premiers political party colors. Hover over<br>a province to get more information about<br>the premier and their political party.',
padding: '5px 10px',
backgroundColor: '#FFF',
borderColor: '#333',
borderRadius: '4px',
borderWidth: '1px',
fontSize: '14px',
textAlign: 'left'
}
],
shapes: [
{
type: 'star5',
tooltip: {
text: 'Toronto',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '486px',
y: '448px'
},
{
type: 'star5',
tooltip: {
text: 'Quebec City',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '530px',
y: '420px'
},
{
type: 'star5',
tooltip: {
text: 'St. Johns',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '672px',
y: '414px'
},
{
type: 'star5',
tooltip: {
text: 'Fredericton',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '576px',
y: '428px'
},
{
type: 'star5',
tooltip: {
text: 'Halifax',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '596px',
y: '442px'
},
{
type: 'star5',
tooltip: {
text: 'Charlottetown',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '3px',
x: '599px',
y: '424px'
},
{
type: 'star5',
tooltip: {
text: 'Winnipeg',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '360px',
y: '380px'
},
{
type: 'star5',
tooltip: {
text: 'Saskatoon',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '295px',
y: '360px'
},
{
type: 'star5',
tooltip: {
text: 'Edmonton',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '242px',
y: '343px'
},
{
type: 'star5',
tooltip: {
text: 'Victoria',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '172px',
y: '402px'
},
{
type: 'star5',
tooltip: {
text: 'Whitehorse',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '91px',
y: '262px'
},
{
type: 'star5',
tooltip: {
text: 'Yellowknife',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '242px',
y: '250px'
},
{
type: 'star5',
tooltip: {
text: 'Iqaluit',
backgroundColor: '#FFF',
borderRadius: '4px',
color: '#333'
},
backgroundColor: '#FFF',
size: '4px',
x: '562px',
y: '235px'
},
{
type: 'zingchart.maps',
options: {
id: 'map',
name: 'can',
scale: true,
style: {
controls: {
visible: false
},
items: {
AB: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(245,130,32);color:#FFF;>Alberta</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Rachel Notley<br><span style=font-weight:800;>Party</span>: New Democratic Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/rnotley.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(245,130,32)',
hoverState: {
backgroundColor: 'rgb(255,170,60)'
}
},
BC: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(55,113,169);color:#FFF;>British Columbia</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Christy Clark<br><span style=font-weight:800;>Party</span>: British Columbia Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/cclark.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(55,113,169)',
hoverState: {
backgroundColor: 'rgb(100,153,219)'
}
},
MB: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(245,130,32);color:#FFF;>Manitoba</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Greg Selinger<br><span style=font-weight:800;>Party</span>: New Democratic Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/gselinger.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(245,130,32)',
hoverState: {
backgroundColor: 'rgb(255,170,60)'
}
},
NB: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>New Brunswick</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Brian Gallant<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/bgallant.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
NF: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(0,50,160);color:#FFF;>Newfoundland & Labrador</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Paul Davis<br><span style=font-weight:800;>Party</span>: Progressive Conservative</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/pdavis.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(0,50,160)',
hoverState: {
backgroundColor: 'rgb(0,10,200)'
}
},
NS: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>Nova Scotia</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Stephen McNeil<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/smcneil.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
NT: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(100,100,100);color:#FFF;>Northwest Territories</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Bob McLeod<br><span style=font-weight:800;>Party</span>: Independent</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/bmcleod.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: '#ffffff',
backgroundImage: 'PATTERN_SHADE_50'
},
NU: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(50,50,50);color:#FFF;width:100%;>Nunavut</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Peter Taptuna<br><span style=font-weight:800;>Party</span>: Independent</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/ptaptuna.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: '#ffffff',
backgroundImage: 'PATTERN_SHADE_75'
},
ON: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>Ontario</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Kathleen Wynne<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/kwynne.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
PE: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(215,25,32);color:#FFF;>Prince Edward Island</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Wade MacLauchlan<br><span style=font-weight:800;>Party</span>: Liberal</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/wmachlauchlan.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(215,25,32)',
hoverState: {
backgroundColor: 'rgb(255,50,70)'
}
},
QC: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(0,122,194);color:#FFF;>Quebec</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Philippe Couillard<br><span style=font-weight:800;>Party</span>: Quebec Liberal Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/pcouillard.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(0,122,194)',
hoverState: {
backgroundColor: 'rgb(0,170,255)'
}
},
SK: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(1,81,68);color:#FFF;>Saskatchewan</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Brad Wall<br><span style=font-weight:800;>Party</span>: Saskatchewan Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/bwall.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(1,81,68)',
hoverState: {
backgroundColor: 'rgb(50,130,120)'
}
},
YT: {
tooltip: {
text: '<div style=font-weight:800;text-align:center;background-color:rgb(14,92,153);color:#FFF;>Yukon</div><div style=line-height:initial;border-top:1px solid #d9d9d9;border-bottom:1px solid #d9d9d9;margin:10px 0px;><span style=font-weight:800;>Premier</span>: Darrell Pasloski<br><span style=font-weight:800;>Party</span>: Yukon Party</div><img style=border-radius:50%;display:block;margin:0 auto; src=//www.zingchart.com/images/dpasloski.jpg>',
height: '250px',
htmlMode: true,
textAlign: 'left',
width: '200px'
},
backgroundColor: 'rgb(14,92,153)',
hoverState: {
backgroundColor: 'rgb(54,152,253)'
}
}
},
label: {
alpha: 0
},
shadow: true
},
width: '100%',
height: '100%',
x: '0px',
y: '0px'
}
}
]
};
zingchart.loadModules('maps,maps-can,patterns');
zingchart.render({
id: 'myChart',
data: chartConfig,
height: '100%',
width: '725',
});