<!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> html, body, #myChart { height: 100%; width: 100%; } </style> </head> <body> <div id='myChart'></div> <script> ZC.LICENSE = ["569d52cefae586f634c54f86dc99e6a9", "b55b025e438fa8a98e32482b5f768ff5"]; var myConfig = { type: 'heatmap', title: { text: 'Symptoms to Display', fontFamily: 'Georgia' }, plot: { tooltip: { text: '%t symptoms:<br>Ages %kl: %v', textAlpha: 1, fontColor: 'black', backgroundColor: 'white', borderWidth: 1, borderColor: 'gray', borderRadius: '3px', alpha: 0.7, padding: '10%' } }, scaleX: { labels: ['13 & under', '13-17', '18-24', '25-34', '35-44', '45-54', '55+'], tick: { visible: false }, guide: { visible: false } }, scaleY: { tick: { visible: false }, guide: { visible: false } }, plotarea: { marginLeft: 'dynamic' }, series: [{ values: [59, 15, 5, 30, 60, 99, 28], text: 'Body Ache' }, { values: [34, 32, 87, 65, 9, 17, 40], text: 'Cough' }, { values: [90, 19, 50, 39, 12, 49, 14], text: 'Sore Throat' }, { values: [59, 15, 5, 30, 60, 99, 28], text: 'Rash' }, { values: [34, 32, 87, 65, 9, 17, 40], text: 'Nausea' }, { values: [90, 19, 50, 39, 12, 49, 14], text: 'Headache' }, { values: [59, 15, 5, 30, 60, 99, 28], text: 'Flu' }, { values: [34, 32, 87, 65, 9, 17, 40], text: 'Cold' } ] }; zingchart.render({ id: 'myChart', data: myConfig, height: 400, width: 600 }); </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>
html, body, #myChart { height: 100%; width: 100%; }
var myConfig = { type: 'heatmap', title: { text: 'Symptoms to Display', fontFamily: 'Georgia' }, plot: { tooltip: { text: '%t symptoms:<br>Ages %kl: %v', textAlpha: 1, fontColor: 'black', backgroundColor: 'white', borderWidth: 1, borderColor: 'gray', borderRadius: '3px', alpha: 0.7, padding: '10%' } }, scaleX: { labels: ['13 & under', '13-17', '18-24', '25-34', '35-44', '45-54', '55+'], tick: { visible: false }, guide: { visible: false } }, scaleY: { tick: { visible: false }, guide: { visible: false } }, plotarea: { marginLeft: 'dynamic' }, series: [{ values: [59, 15, 5, 30, 60, 99, 28], text: 'Body Ache' }, { values: [34, 32, 87, 65, 9, 17, 40], text: 'Cough' }, { values: [90, 19, 50, 39, 12, 49, 14], text: 'Sore Throat' }, { values: [59, 15, 5, 30, 60, 99, 28], text: 'Rash' }, { values: [34, 32, 87, 65, 9, 17, 40], text: 'Nausea' }, { values: [90, 19, 50, 39, 12, 49, 14], text: 'Headache' }, { values: [59, 15, 5, 30, 60, 99, 28], text: 'Flu' }, { values: [34, 32, 87, 65, 9, 17, 40], text: 'Cold' } ] }; zingchart.render({ id: 'myChart', data: myConfig, height: 400, width: 600 });