How can i have color axis in bubble chart using Highchart?

by

Based on the answer from this topic – stepped-color-shading-in-highcharts-doughnut-chart.

Wrapping bubble’s prototype:

var bubbleProto = Highcharts.seriesTypes.bubble.prototype;

  bubbleProto.axisTypes = ['xAxis', 'yAxis', 'colorAxis'];
  bubbleProto.optionalAxis="colorAxis";
  bubbleProto.colorKey = 'y';

  Highcharts.wrap(bubbleProto, 'translate', function(proceed) {
    proceed.apply(this, Array.prototype.slice.call(arguments, 1));

    Highcharts.seriesTypes.heatmap.prototype.translateColors.call(this);
  });

Live example and output

http://jsfiddle.net/4y3qgdmn/41/

bubble series with color axis

More Related Contents:

  1. Highcharts percentage of total for simple bar chart
  2. Proper way to remove all series data from a highcharts chart?
  3. customize highcharts tooltip to show datetime
  4. Set Additional Data to highcharts series
  5. How to write your own custom legends for google line chart/ Google line chart legend manipulation
  6. Google Bar Chart cannot Change Individual Bar Color
  7. How do you create a family tree in d3.js?
  8. I want to change the chart for each city or subcity selected
  9. How to add two Google charts on the one page?
  10. variable background colors in google line chart
  11. How to add colors to spefic columns in Google Charts
  12. Click events on Pie Charts in Chart.js
  13. How to get highcharts dates in the x axis?
  14. How to save an image of the chart on the server with highcharts?
  15. How to put rounded corners on a Chart.js Bar chart
  16. How to clear a chart from a canvas so that hover events cannot be triggered?
  17. How to display pie chart data values of each slice in chart.js
  18. Highcharts – redraw() vs. new Highcharts.chart
  19. How to set ChartJS Y axis title?
  20. Remove x-axis label/text in chart.js
  21. Chart.js v2: How to make tooltips always appear on pie chart?
  22. How to change colours for Angular-Chart.js
  23. Export Highcharts to PDF (using javascript and local server – no internet connection)
  24. Highcharts – Keep tooltip showing on click
  25. d3.js spreading labels for pie charts
  26. How to disable legend click to stop pie slice from disappearing in Highcharts?
  27. How can I fix Highcharts error #13?
  28. creating highchart with ajax json data
  29. Can I scrape the raw data from highcharts.js?
  30. Removing highcharts.com credits link

Leave a Comment