<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ZingSoft Demo</title>
<script nonce="undefined" src="https://cdn.zingchart.com/zingchart.min.js"></script>
<style></style>
</head>
<body>
<div id='myChart'></div>
<script>
ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"];
var myConfig = {
"type": "mixed",
"title": {
"text": "Stock & Volume Chart"
},
"scale-y": {
"offset-start": "35%",
"values": "29:33:2",
"format": "$%v",
"label": {
"text": "Prices"
}
},
"scale-y-2": {
"blended": true,
"offset-end": "75%",
"placement": "default",
"values": "0:3:3",
"format": "%vM",
"label": {
"text": "Volume"
}
},
"series": [{
"type": "stock",
"scales": "scale-x,scale-y",
"values": [
[31.34, 31.46, 30.87, 31.06],
[31.80, 32.25, 31.52, 32.05],
[32.05, 32.57, 31.93, 32.30],
[32.21, 32.39, 31.98, 32.08],
[32.32, 32.38, 32.13, 32.37],
[32.52, 32.53, 31.95, 32.03],
[32.07, 32.14, 31.77, 31.98],
[32.26, 32.33, 31.61, 31.86],
[31.65, 31.85, 31.41, 31.78],
[31.86, 31.97, 31.56, 31.58],
[31.51, 31.65, 31.45, 31.59],
[31.84, 31.87, 31.55, 31.85],
[31.83, 32.08, 31.71, 32.04],
[32.30, 32.36, 31.96, 32.28],
[32.43, 32.88, 32.29, 32.48],
[32.72, 32.74, 32.40, 32.60],
[32.39, 32.46, 32.20, 32.38],
[32.47, 32.49, 31.81, 31.84],
[31.84, 32.20, 31.78, 32.08],
[31.88, 32.11, 31.82, 31.89]
]
},
{
"type": "bar",
"scales": "scale-x,scale-y-2",
"values": [
1.3,
1.5,
2.1,
2.2,
1.9,
1.7,
1.8,
1.9,
1.9,
2.0,
1.4,
2.1,
2.3,
2.6,
2.5,
2.3,
1.5,
2.4,
1.6,
1.4
]
}
]
};
zingchart.render({
id: 'myChart',
data: myConfig,
height: 400,
width: "100%"
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ZingSoft Demo</title>
<script src="https://cdn.zingchart.com/zingchart.min.js"></script>
</head>
<body>
<div id='myChart'></div>
</body>
</html>
var myConfig = {
"type": "mixed",
"title": {
"text": "Stock & Volume Chart"
},
"scale-y": {
"offset-start": "35%",
"values": "29:33:2",
"format": "$%v",
"label": {
"text": "Prices"
}
},
"scale-y-2": {
"blended": true,
"offset-end": "75%",
"placement": "default",
"values": "0:3:3",
"format": "%vM",
"label": {
"text": "Volume"
}
},
"series": [{
"type": "stock",
"scales": "scale-x,scale-y",
"values": [
[31.34, 31.46, 30.87, 31.06],
[31.80, 32.25, 31.52, 32.05],
[32.05, 32.57, 31.93, 32.30],
[32.21, 32.39, 31.98, 32.08],
[32.32, 32.38, 32.13, 32.37],
[32.52, 32.53, 31.95, 32.03],
[32.07, 32.14, 31.77, 31.98],
[32.26, 32.33, 31.61, 31.86],
[31.65, 31.85, 31.41, 31.78],
[31.86, 31.97, 31.56, 31.58],
[31.51, 31.65, 31.45, 31.59],
[31.84, 31.87, 31.55, 31.85],
[31.83, 32.08, 31.71, 32.04],
[32.30, 32.36, 31.96, 32.28],
[32.43, 32.88, 32.29, 32.48],
[32.72, 32.74, 32.40, 32.60],
[32.39, 32.46, 32.20, 32.38],
[32.47, 32.49, 31.81, 31.84],
[31.84, 32.20, 31.78, 32.08],
[31.88, 32.11, 31.82, 31.89]
]
},
{
"type": "bar",
"scales": "scale-x,scale-y-2",
"values": [
1.3,
1.5,
2.1,
2.2,
1.9,
1.7,
1.8,
1.9,
1.9,
2.0,
1.4,
2.1,
2.3,
2.6,
2.5,
2.3,
1.5,
2.4,
1.6,
1.4
]
}
]
};
zingchart.render({
id: 'myChart',
data: myConfig,
height: 400,
width: "100%"
});