score:2
Note: I have modified my answer to better address the specific requests in the original poster's question.
Here's what I would suggest:
Create a stacked column chart, where one of the series is a "dummy" series with which the user can't interact. This will serve as your background.
Here's a quick fiddle I worked up based on the Highcharts stacked column demo: http://jsfiddle.net/brightmatrix/v97p3eam/
plotOptions: {
column: { stacking: 'percent' }
},
series: [
/* this is the "dummy" series
set the "showInLegend" and "enableMouseTracking" attributes
to "false" to prevent user interaction */
{ name: 'dummy data', data: [5, 3, 4, 7, 2], color:'gray',
showInLegend: false, enableMouseTracking: false },
/* here's the real data; set a unique color for each
set nulls for the columns where that color/data is not needed */
{ name: 'Series 1', color: 'red', data: [2,null,null,null,null] },
{ name: 'Series 2', color: 'orange', data: [null,2,null,null,null] },
{ name: 'Series 3', color: 'yellow', data: [null,null,2,null,null] },
{ name: 'Series 4', color: 'green', data: [null,null,null,2,null] },
{ name: 'Series 5', color: 'blue', data: [null,null,null,null,1] }
]
Please let me know if this is helpful for you!
Source: stackoverflow.com
Related Query
- Highcharts - Column chart customization
- How to create a column range chart in Highcharts using range and navigator functions?
- Displaying percentage in Y-axis of Highcharts column chart
- Highcharts : Change opacity of a column chart
- Highcharts donut chart customization
- highcharts jquery dynamic change chart type column to bar
- Highcharts Column chart with drilldown, remove hyperlink like formatting from x-axis labels
- Highcharts - column chart redraw animation
- Hide 0 values in Stacked Column Chart in Highcharts
- Make Highcharts border color match background color on column chart
- Color each point individually in column chart highcharts
- Highcharts Grouped Column Chart with Multiple Groups?
- highcharts - precision for stacked column chart data labels
- Highcharts column + line combination chart with multiple series. Issue aligning line over the column
- I want to add a line to each column in a Highcharts column chart
- How to format my json data for stack column chart in HighCharts
- HighCharts Stock Chart error code 18
- Highcharts Tooltip At Column Chart
- How to add a horizontal line in Column bar chart in Highcharts plugin?
- Highcharts multiple column chart with drilldown, correct formatting of drilldown axes
- Change legend symbol in Column Chart in highcharts
- HighCharts Data Structure - Multiple Independent Series, Stacked Column Chart
- How to Build a Column Chart in Highcharts with Data Entered Dynamically Within a CMS
- HighCharts pointPlacement option not working in a single column chart
- Drilldown for grouped column chart in highcharts
- Highcharts - column chart with drilldown to waterfall
- Legend for each point in column chart in highcharts
- Highcharts - Column chart with empty columns for date in x-axis
- Get the end points of each bar in a highcharts column chart
- Can highcharts generate a 3d column chart like this?
More Query from same tag
- Highcharts Line Chart - Hyperlink on a data point
- Highcharts chart with Error bars from CSV
- plotOptions.series.point.events returns null point data when using a drilldown
- Incorrect minimum and maximum in highcharts
- Highcharts position tooltip at the middle of stacked bar
- Highcharts pie with strokes
- Creating highstock zoom-in/out button
- Highstock change xAxis minRange after chart is loaded
- Make Highchart and Highstock Have a Uniform Time X-Axis for Disparate Data Points
- How to display Multiple Highchart in single page
- Highchart live server example uses a lot cpu
- How to connect/sync xAxis crosshairs between multiple HighStocks charts
- Combining graphs in highcharts
- Setting the length of the X-Axis of a Highchart to be 24 hours from time of first data point with less than 24 hours of data to display
- Passing JSON in variable to HighCharts
- Individual positioning of x-axis labels in a polar highchart
- How to change the color of single point in spiderweb chart
- Positioning Highstock Zoom Buttons outside the chart area within a <div>
- Highcharts area graph with fillColor changing color depending on the zone color?
- How to load the highcharts plugins?
- customize highcharts tooltip to show datetime
- Updating Chart with live Values, adding second line
- Highcharts enable pan without holding panKey
- highcharts gauge use with negative values
- Highstock xAxis scaling
- Tooltip appears under plotLine highcharts
- dynamic data to Jquery code in ASP .Net Visual Studio
- How to create a highchart using mysql data (PHP)?
- can hightcharts make ajax calls to external data files?
- Labels are not rendering for plotLines highcharts