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²'
}
}]
});
}
});
highmaps如何自定义 区间的颜色刻度的更多相关文章
- 32.QT-制作最强电压电阻表盘,可以自定义阴影效果,渐变颜色,图标,文字标签等-附带demo程序
由于上位机需要绘制电压电阻表盘,如下图所示: 后来,在网上找阿找,还是没找到满意的,索性自己来画控件算了,由于第一次画控件,所以花了我2天时间,才画好 效果图如下: 上图的所有颜色(包括滑动的渐变/单 ...
- android 自定义进度条颜色
android 自定义进度条颜色 先看图 基于产品经理各种自定义需求,经过查阅了解,下面是自己对Android自定义进度条的学习过程! 这个没法了只能看源码了,还好下载了源码, sources\b ...
- swift 自定义导航栏颜色
func setNavigationApperance(){ //自定义导航栏颜色 [self.navigationController?.navigationBar.barTintColor = U ...
- 将网站固定到开始菜单,自定义图标、颜色和Windows推送通知
Windows 8.1——将网站固定到开始菜单,自定义图标.颜色和Windows推送通知 记得在IE 9和Windows 7刚出来那会儿我写过一篇文章来介绍如何自定义网站将其固定到Windows的任务 ...
- Android 学习笔记二 自定义按钮形状 颜色 点击渐变
问题:自定义按钮的颜色 形状弧度 渐变效果 1.新建自定义属性button_login.xml (借鉴某大神) <?xml version="1.0" encoding=& ...
- Windows 8.1——将网站固定到开始菜单,自定义图标、颜色和Windows推送通知
记得在IE 9和Windows 7刚出来那会儿我写过一篇文章来介绍如何自定义网站将其固定到Windows的任务栏上,同时自定义图标及任务内容.那个功能在IE 9中被称之为JumpList.http:/ ...
- 【css3】如何自定义 placeholder 文本颜色
昨天写了一篇基于 jquery 实现 ie 浏览器兼容 placeholder 效果,具体内容点击传送门.不过还是有点小瑕疵,就是不能设置 placeholder 文本颜色.本文主要介绍利用 css ...
- Sencha Touch 2.3 自定义主题皮肤,颜色
写博客园越来越懒了,只写重点部分,不明白的可以Q我. 1.当你通过Cmd生成项目之后,App\resources\sass就是我们的样式源文件 2.想自定义自己的样式分为两种方式 扩展:这个是基于st ...
- CoolViewPager:即刻刷新,自定义边缘效果颜色,双向自动循环,内置垂直切换效果,想要的都在这里
这两天在GitHub上传了一个自定义ViewPager:CoolViewPager,具有以下功能特征: 支持水平及垂直方向循环滚动 支持自动滚动 支持自动滚动方向.滚动时间.间隔时间的设置 支持调用n ...
随机推荐
- ionic2 生命周期
在 Ionic 2 的版本中生命周期命名的改变,以及各个事件的解释. 官方文档地址在 这里 . 事件名称 事件说明 ionViewLoaded 页面加载完毕触发.该事件发生在页面被创建成 DOM 的时 ...
- 设计中最常用的CSS选择器
准确而简洁的运用CSS选择器会达到非常好的效果.我们不必通篇给每一个元素定义类(class)或ID,通过合适的组织,可以用最简单的方法实现同样的效果.在实际工作中,最常用的选择器有以下五类: 一.标签 ...
- Windoows窗口程序五
程序执行机制 过程驱动-程序的执行过程是按照预订好的顺序执行. 事件驱动-程序的执行是无序,用户可以根据需要随机触发相应的事件. Win32窗口程序就是采用事件驱动方式执行,也就是消息机制. 当系统通 ...
- js 查找指定函数的内容
function test(){ //hahahhahahhahahha }alert(test.toString());
- shell脚本中特定符合变量的含义
shell脚本中特定符合变量的含义: $# 传递到脚本的参数个数 $* 以一个单字符串显示所有向脚本传递的参数.与位置变量不同,此选项参数可超过9个 $$ 脚本运行的当前进程PID号 ...
- HBase 1.3(NOSQL) 发布,性能大幅提升
Apache HBase 1.3.0版在2017年1月中旬正式发布了,新版本支持分层数据的压缩和多个方面的性能提升,像预写日志(WAL).一个新的RPC机制,等等.HBase 1.3.0一共修 ...
- input 监听输入事件
$("#" + inputId).on("input", function () { var checkboxId = $("#" + in ...
- Java集合----Set集合
Set集合 Set 集合不允许包含相同的元素,如果试把两个相同的元素加入同一个 Set 集合中,则添加操作失败. Set 判断两个对象是否相同不是使用 == 运算符,而是根据 equals 方法 Ha ...
- jquery书写左右两个多选下拉列表交换移除功能
使用jquery做一个多选列表左右互换的功能,代码如下 <!DOCTYPE HTML> <html lang="en-US"> <head> & ...
- GIS-006-ArcGIS API 空间关系
Name Description 解释 SPATIAL_REL_CONTAINS Part or all of a feature from feature class 1 is contained ...