123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566 |
- <!DOCTYPE HTML>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <title>Highcharts Example</title>
- <style type="text/css">
- #container {
- max-width: 800px;
- height: 400px;
- margin: 1em auto;
- }
- </style>
- </head>
- <body>
- <script src="../../code/highcharts.js"></script>
- <script src="../../code/modules/histogram-bellcurve.js"></script>
- <div id="container"></div>
- <script type="text/javascript">
- var data = [3.5, 3, 3.2, 3.1, 3.6, 3.9, 3.4, 3.4, 2.9, 3.1, 3.7, 3.4, 3, 3, 4, 4.4, 3.9, 3.5, 3.8, 3.8, 3.4, 3.7, 3.6, 3.3, 3.4, 3, 3.4, 3.5, 3.4, 3.2, 3.1, 3.4, 4.1, 4.2, 3.1, 3.2, 3.5, 3.6, 3, 3.4, 3.5, 2.3, 3.2, 3.5, 3.8, 3, 3.8, 3.2, 3.7, 3.3, 3.2, 3.2, 3.1, 2.3, 2.8, 2.8, 3.3, 2.4, 2.9, 2.7, 2, 3, 2.2, 2.9, 2.9, 3.1, 3, 2.7, 2.2, 2.5, 3.2, 2.8, 2.5, 2.8, 2.9, 3, 2.8, 3, 2.9, 2.6, 2.4, 2.4, 2.7, 2.7, 3, 3.4, 3.1, 2.3, 3, 2.5, 2.6, 3, 2.6, 2.3, 2.7, 3, 2.9, 2.9, 2.5, 2.8, 3.3, 2.7, 3, 2.9, 3, 3, 2.5, 2.9, 2.5, 3.6, 3.2, 2.7, 3, 2.5, 2.8, 3.2, 3, 3.8, 2.6, 2.2, 3.2, 2.8, 2.8, 2.7, 3.3, 3.2, 2.8, 3, 2.8, 3, 2.8, 3.8, 2.8, 2.8, 2.6, 3, 3.4, 3.1, 3, 3.1, 3.1, 3.1, 2.7, 3.2, 3.3, 3, 2.5, 3, 3.4, 3];
- Highcharts.chart('container', {
- title: {
- text: 'Highcharts Histogram'
- },
- xAxis: [{
- title: { text: 'Data' },
- alignTicks: false
- }, {
- title: { text: 'Histogram' },
- alignTicks: false,
- opposite: true
- }],
- yAxis: [{
- title: { text: 'Data' }
- }, {
- title: { text: 'Histogram' },
- opposite: true
- }],
- series: [{
- name: 'Histogram',
- type: 'histogram',
- xAxis: 1,
- yAxis: 1,
- baseSeries: 's1',
- zIndex: -1
- }, {
- name: 'Data',
- type: 'scatter',
- data: data,
- id: 's1',
- marker: {
- radius: 1.5
- }
- }]
- });
- </script>
- </body>
- </html>
|