Stig Eide
Stig Eide

Reputation: 1062

Specify color for each point in scatter3d

I try to implement this, but for scatter3d: https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/point/color

series: [{
    data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, {
        y: 216.4,
        color: '#BF0B23'
    }, 194.1, 95.6, 54.4]

I would like to specify the color of each bubble in this: https://jsfiddle.net/638yn59p/11/

series: [{
    name: 'Data',
    colorByPoint: true,
    accessibility: {
        exposeAsGroupOnly: true
    },
    data: [[0.052359,-0.316845,0.122564],

Upvotes: 0

Views: 68

Answers (2)

Sebastian Wędzel
Sebastian Wędzel

Reputation: 11633

You can also specify a wanted color for each point by defining it in the data. When your data is an array of objects, the config should look like this:

[{
  x: ...,
  y: ...,
  z: ..., 
  color: 'string',
}]

Or you can define it in the array of arrays, but you will need to use the series.keys feature to make able render it.

Demo: https://jsfiddle.net/BlackLabel/g5rvmnhe/

  series: [{
    name: 'Data',
    keys: ['x', 'y', 'z', 'color'],
    data: [
      [0.052359, -0.316845, 0.122564, 'red'],
    ]
  }]

API: https://api.highcharts.com/highcharts/series.line.keys

Upvotes: 1

Stig Eide
Stig Eide

Reputation: 1062

Seems like this did the trick: Add variable for the colors:

var colors = ['#FF530D','#FF530D','#FF530D','#FF530D','#FF530D', '#E82C0C', '#FF0000']

Use the variable in the series:

series: [{
    name: 'Data',
    colorByPoint: true,
    colors: colors,

Upvotes: 0

Related Questions