highmaps如何自定义 区间的颜色刻度

https://api.highcharts.com/highmaps/colorAxis.dataClassColor

http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/coloraxis/dataclasscolor/

 https://api.highcharts.com/highmaps/colors

 、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、

LEGACY

In Highcharts 3.x, the default colors were:

colors: ['#2f7ed8', '#0d233a', '#8bbc21', '#910000', '#1aadce',
    '#492970', '#f28f43', '#77a1e5', '#c42525', '#a6c96a']
、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、、

 

// Load the data from a Google Spreadsheet
// https://docs.google.com/a/highsoft.com/spreadsheet/pub?hl=en_GB&hl=en_GB&key=0AoIaUO7wH1HwdFJHaFI4eUJDYlVna3k5TlpuXzZubHc&output=html
Highcharts.data({

googleSpreadsheetKey: '0AoIaUO7wH1HwdFJHaFI4eUJDYlVna3k5TlpuXzZubHc',

// custom handler when the spreadsheet is parsed
parsed: function (columns) {

// Read the columns into the data array
var data = [];
$.each(columns[0], function (i, code) {
data.push({
code: code.toUpperCase(),
value: parseFloat(columns[2][i]),
name: columns[1][i]
});
});

// Initiate the chart
Highcharts.mapChart('container', {
chart: {
borderWidth: 1
},

colors: ['rgba(64,19,117,0.05)', 'rgba(64,19,117,0.2)', 'rgba(64,19,117,0.4)',
'rgba(64,19,117,0.5)', 'rgba(64,19,117,0.6)', 'rgba(64,19,117,0.8)', 'rgba(64,19,117,1)'],

title: {
text: 'Data classes with categorized colors'
},

mapNavigation: {
enabled: true
},

legend: {
title: {
text: 'Individuals per km²'
},
align: 'left',
verticalAlign: 'bottom',
floating: true,
layout: 'vertical',
valueDecimals: 0,
backgroundColor: 'rgba(255,255,255,0.9)',
symbolRadius: 0,
symbolHeight: 14
},

colorAxis: {
dataClassColor: 'category',
dataClasses: [{
to: 3
}, {
from: 3,
to: 10
}, {
from: 10,
to: 30
}, {
from: 30,
to: 100
}, {
from: 100,
to: 300
}, {
from: 300,
to: 1000
}, {
from: 1000
}]
},

series: [{
data: data,
mapData: Highcharts.maps['custom/world'],
joinBy: ['iso-a2', 'code'],
name: 'Population density',
states: {
hover: {
borderColor: '#303030',
borderWidth: 2
}
},
tooltip: {
valueSuffix: '/km²'
}
}]
});
}
});