score:2
Accepted answer
the only problem i see is that you are missing a double quote in your second <script>
tag. otherwise, it seems to work fine.
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' }
}, {
title: { text: 'histogram' },
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 src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/histogram-bellcurve.js"></script>
<div id="container" height="400px" width="800px"></div>
score:1
it works in jsfiddle https://jsfiddle.net/dgdcnmwx/
first, the html you posted is invalid html. your second script is missing a closing ". the div's id has invisible white space characters. there is no html element, etc.
your html should look like this:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>title</title>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/histogram-bellcurve.js"></script>
</head>
<body>
<div id="container" height="400px " width="800px "></div>
</body>
<script>
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' }
}, {
title: { text: 'histogram' },
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>
</html>
Source: stackoverflow.com
Related Query
- Getting "Highcharts error #17" when creating histogram (using Highcharts with Angular 6)
- HighCharts Stock Chart error code 18
- highcharts error #13 histogram
- Angular highcharts is returning error trying to draw a histogram
- Error: Data source must be a URL for refresh | console error | javascript | Highcharts
- How can I fix Highcharts error #13?
- Highcharts Error #16: charts not showing on the same page
- Getting error while using highcharts in Angular 7
- highcharts always console error ablout bubble_compiled.js?
- Highcharts error 15
- JavaScript error when using Highcharts
- Highcharts is not defined. Error log in console
- Highcharts returning error 14
- jquery calling highcharts generating error 17
- highcharts organization chart is throwing error when loading module
- Using PhantomJS to create HighCharts grahps server side for use in PDF creation (PHP) - results in exit code 11 from PHPs exec();
- HighCharts error #18: Requested Axis Does not exist
- Highcharts - Global configuration with common code and unique data & Headings
- creating a bar chart using Highcharts with React - getting an error that rendering div isn't found
- Highcharts error #13: www.highcharts.com/errors/13 how to solve this error
- Issues using highcharts node export server from ClojureScript - "0x03 error when performing chart generation"
- Highcharts & tooltip error
- Highcharts error 13, but rendering Div exists
- Error while adding and removing plotLine on highcharts
- How to improve performance of Highcharts and avoid error 15 inspite of sorted data?
- highcharts export server js script error codes
- highcharts change rendered image source on click
- highcharts - error when updating a series to have less categories than previously
- c# WPF Webbrowser with Highchart, Javascript from external source not working "An error has occurred in the script on this page"
- Uncaught Highcharts error #19: www.highcharts.com/errors/19
More Query from same tag
- Hover entire container contents with an Overlay
- Does not return data as intended when creating the chart
- How to group area chart extremes for x-axis dynamically with day,week,months value in highstock
- Store Highcharts in Javascript Function - How to?
- Highcharts Node.js export server : Connection error
- 3 level Drilldown of a column chart in highchart?
- Highcharts: collecting all charts on a page second time produces error
- highstock charts - button for date range
- highcharts scale chart to width
- How Highstock determines date
- Highcharts loading data from a table generated by Ajax
- how to change bar hover color of highchart dynamically?
- Highcharts highstock plot with data from php
- How to use tickPositioner, to have different distance between lines of grid (Yaxis)?
- Change the color of the navigator
- How to remove duplicate values in specific column without removing related row
- Highstock - Display last chart point in the center of the Y axis
- Can't update highcharts data on button - var visibility or events handle issue
- HighCharts - How to set a max value of 100%
- Highcharts: legendItemClick: make background transparent instead of deleting it
- Highcharts: Dynamically update dataLabels in synchronization with setData
- OHLC chart draw a line on from one point to another
- Highcharts.js variable pie chart not rendering data correctly along percentage dataLabels
- Using Highcharts with mysql for Page Visits
- Highcharter annotation on date x-axis not working - R
- php-fed Highcharts time series throws T_variable error, why?
- Not interpolate missing dates in Highcharts
- Highcharts animation with color blending
- Highcharts ; x-axis scaling issue
- Highcharts increase the space/gap between grouped data series