非常优秀的HTML5地图组件,支持下钻、触摸、手势等操作。
Highmaps 继承了 Highcharts 简单易用的特性。利用它可以方便快捷的创建用于展示销售、选举结果等其他与地理位置关系密切的交互地图图表。
最简单好用的JavaScript 甘特图库。
方便易用的交互式甘特图,可以用于展示时间分配、任务调度、事件及资源使用情况。
开头笔者提到过:Highcharts 是基于 JavaScript 编写的图表库。
因为很多人并不是很擅长前端语言,所以有位大神编写出来基于 Python 的第三方的库:python-highcharts,详细说明见github https://github.com/kyper-data/python-highcharts
安装 python-highcharts 非常的简单:
pipinstallpython-highcharts
目前 python-highcharts 支持 Python2.7/3.4 ,python版本需要满足需求
使用demo安装好 python-highcharts 之后,我们用一个小案例来说明如何通过它绘制图形,首先看看整体的代码和图形:
#1-导入库和实例化
fromhighchartsimportHighchart
chart=Highchart()
#2-配置项设置
options={
'chart':{
'inverted':True#翻转x轴和y轴
},
'title':{#主标题
'text':'AtmosphereTemperaturebyAltitude'
},
'subtitle':{#副标题
'text':'AccordingtotheStandardAtmosphereModel'
},
'xAxis':{#x轴设置
'reversed':False,
'title':{
'enabled':True,
'text':'Altitude'
},
'labels':{
'formatter':'function(){\
returnthis.value "km";\
}'
},
'maxPadding':0.05,
'showLastLabel':True
},
'yAxis':{#y轴设置
'title':{
'text':'Temperature'
},
'labels':{
'formatter':"function(){\
returnthis.value '°';\
}"
},
'lineWidth':2
},
'legend':{#图例设置
'enabled':False
},
'tooltip':{#提示工具设置
'headerFormat':'<b>{series.name}</b><br/>',
'pointFormat':'{point.x}km:{point.y}°C'
}
}
#3-实例化对象中添加配置
chart.set_dict_options(options)
#4-绘图所需的数据和添加数据
data=[[0,15],
[10,-50],
[20,-56.5],
[30,-46.5],
[40,-22.1],
[50,-2.5],
[60,-27.7],
[70,-55.7],
[80,-76.5]]
#添加数据
chart.add_data_set(data,'spline','Temperature',marker={'enabled':False})
#5-在线绘图
chart
通过上面的代码我们可以看到使用 python-highcharts 绘图的5个基本步骤:
- 导入库和示例化对象
- 设置各种配置项;配置项都是字典形式
- 往实例化对象中添加字典形式的配置项
- 准备数据和往实例化对象中添加数据,并设置图形的相关信息
- notebook中在线绘图
fromhighchartsimportHighchart#导入库
H=Highchart(width=750,height=600)#设置图形的大小
#4组数据,代表4个年份
#每组5个数据代表的是5个洲
data1=[107,31,235,203,24]
data2=[133,156,947,868,106]
data3=[373,914,854,732,34]
data4=[652,954,1250,740,38]
#进行配置
options={
'chart':{#加上chart配置变成水平柱状图
'type':'bar'
},
'title':{#1、主标题
'text':'Stackedbarchart'
},
'subtitle':{#2、副标题
'text':'Source:<ahref="https://en.wikipedia.org/wiki/World_population">Wikipedia.org</a>'
},
'xAxis':{#3、横轴的5个分类
'categories':['Africa','America','Asia','Europe','Oceania'],
'title':{
'text':"5个洲"#x轴的名称
}
},
'yAxis':{
'min':0,#设置最小值
'title':{
'text':'人口数(百万)',#y轴名称
'align':'high'
},
'labels':{
'overflow':'justify'
}
},
'tooltip':{
'valueSuffix':'millions'
},
'legend':{#图例设置
'layout':'vertical',#垂直方向
'align':'right',#靠右显示
'verticalAlign':'top',#顶部
'x':-40,
'y':80,
'floating':True,
'borderWidth':2,#图例外围线条宽度
'backgroundColor':"((Highcharts.theme&&Highcharts.theme.legendBackgroundColor)||'#9ACFF0')",#图例背景颜色
'shadow':True
},
'credits':{#右下角的版权标签
'enabled':True
},
'plotOptions':{
'bar':{
'dataLabels':{
'enabled':True#显示数据(柱状图顶部的数据显示出来)
}
}
}
}
H.set_dict_options(options)#添加配置
#每个年份添加一组数据
H.add_data_set(data1,'bar','Year2000')
H.add_data_set(data2,'bar','Year2004')
H.add_data_set(data3,'bar','Year2008')
H.add_data_set(data4,'bar','Year2012')
H