Highcharts Demo

author(s): Torstein Hønsi

by oysteinmoseng

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://github.highcharts.com/sonification/modules/sonification.js"></script>
<div id="container"></div>
<button id="start">
  Start
</button>

CSS

#container {
    max-width: 800px;
    height: 400px;
    margin: 1em auto;
}

#start {
    width: 150px;
    margin-left: 20px;
}

JavaScript

var chart = Highcharts.chart('container', {
    title: {
        text: 'Sonification demo'
    },
    
    series: [{
    		name: 'Testdata',
    		type: 'spline',
        marker: {
        		enabled: false
        },
        data: [100, 100, 100, 100, 100, 100, 129.9, 130, 130, 130, 171.5, 150, 150, 150, 206.4, 200, 200, 429.2, 200, 200, 144.0, 150, 150, 150, 150, 166.0, 175.6, 178.5, 200, 200, 216.4, 200, 200, 200, 200, 210, 200, 200, 210, 210, 210, 200, 200, 200, 200, 194.1, 495.6, 554.4]
    }],
    
    sonification: {
	  		minFrequency: 200
    }
});

document.getElementById('start').onclick = function () {
		chart.sonify();
};