score:3
depending on what you want to display, it should be possible. the bubble charts will allow the same options as any other highcharts. the easiest way is to use datalabels http://api.highcharts.com/highcharts#plotoptions.scatter.datalabels
datalabels:{
enabled:true
}
if that isn't flexible enough for you, it is possible to draw whatever you want on the chart using the underlying renderer http://api.highcharts.com/highcharts#renderer. this is a bit harder, but. fairly straight forward once you get the hang of it.
i've created a small example using datalabels here :http://jsfiddle.net/4nrk6/
datalabels can be customised with a formatter function, for example:
datalabels: {
enabled: true,
formatter: function() {
return this.y +'mm';
}
}
the full documentation is here: http://api.highcharts.com/highcharts#plotoptions.column.datalabels
if you want extra information on the bubbles, you may need to format your data series as follows:
[
{x:1, y:5, bubbletext:"bubble 1"},
{x:2, y:15, bubbletext:"bubble 2"},
{x:3, y:5, bubbletext:"bubble 3"}
]
inside your datalabel, you can then reference this.point.bubbletext as well as this.x and this.y.
score:14
there are two things you need to do.
first, name each data point (bubble):
data: [ { name: 'alice', x: 3.5, y: 4, z: 5}, { name: 'eve', x: 7, y: 7, z: 3}, { name: 'carol', x: 4, y: 8, z: 6} ]
second, create a data label formatter:
datalabels: { enabled: true, formatter: function() { return this.point.name; } }
you can see this in action here: http://jsfiddle.net/franzo/jugdp/1/
bob's your uncle.
Source: stackoverflow.com
Related Query
- Highcharts naming of individual bubbles
- HighCharts : Is it possible to customize the colors of individual series?
- Customizing the colors of individual series in HighCharts
- Color individual markers on hover in Highcharts
- Using PhantomJS to create HighCharts grahps server side for use in PDF creation (PHP) - results in exit code 11 from PHPs exec();
- Highcharts - Global configuration with common code and unique data & Headings
- HIghcharts individual plot point color
- Individual point color in highcharts scatterplot
- Is there any way to fill bubbles partially in highcharts bubble chart?
- Highcharts hide connected line between individual points
- Highcharts Bubble Chart - How to move an individual point's data label (dataLabel) to the front/top
- Highcharts - bubble diagram need smaller bubbles infront of bigger
- HighCharts Stock Chart error code 18
- Highcharts - Bubble chart - Proportional bubbles
- highcharts change rendered image source on click
- How do i add mouse wheel code in Angular2 highcharts in typescript
- how to display 2 same highcharts without duplicate the code
- Use of DotNet HighCharts dll to make charts in code behind
- How to edit tooltip in Highcharts C# code
- what means ${demo.css} in example files of highcharts ? That piece of code seems to be literal
- Highcharts change symbol and hover text of individual points Line Chart
- Highcharts - prevent large marker from overflowing axes - my bubbles are escaping =(
- passing json values to highcharts from .net code behind
- how to use highcharts tooltip formatter in python code
- passing formatting JavaScript code to HighCharts with JSON
- Highcharts Polar Chart Manually setting individual slice widths
- Highcharts display label for pie chart using html table as data source
- Simple, Open source PHP wrapper for Highcharts library
- Creating a responsive accumulated rain chart from a series containing individual rain fall data using Highcharts
- Add Source to Highcharts Export CSV
More Query from same tag
- How to display HighCharts with tables
- Highcharts display date as series label from JSON data?
- Disable stacklabel for scatter line in highchart?
- Highcharts pointer cursor for chart click event
- How to make a chart with highcharts, load data from API
- Javascript setInterval/setTimeout not working when browser tab not focused
- Highcharts: Bar inside of a stacked bar
- Drilldown on column graph using Highcharts
- Highcharts - Remove first marker from Area chart in every series
- How to Apply Rotation to Drilldown Lable in Highcharts
- Yii HighCharts not displaying from $vars but display when hardcoded
- Highmaps with US States in Rails
- Highcharts: Drag Point Over Another Point Invokes Click Event
- General Drawing in Highcharts with Angular 6
- Displaying linechart using angular2-highcharts
- Highcharts: Additional legend items to control multiple items
- HighCharts / HighStock newly added series have problem with shared tooltips and mouse hover effect
- Highcharts shows data but can't display chart
- Highcharts - restrict sankey diagram to only one level
- JSFiddle 'Please use Post Requst' error
- Howto move dataLabels to the border of the plot area?
- Highcharts - load json data
- Fixing the decimals on y axis to 5 places
- High chart animation lag after it moves from viewport
- Is there a way to configure columns in highchart to have zero pointPadding AND a maxPointWidth?
- Highstocks 1M Zoom not active
- Why Highcharts box only show with some position
- Highmaps chart is empty in Angular 5
- Handling two ajax calls on single page to pull data into Highcharts on another page
- Issue Converting Highcharts to 24 hours format