Highcharts说明文档.docx
- 文档编号:10850261
- 上传时间:2023-02-23
- 格式:DOCX
- 页数:27
- 大小:1.32MB
Highcharts说明文档.docx
《Highcharts说明文档.docx》由会员分享,可在线阅读,更多相关《Highcharts说明文档.docx(27页珍藏版)》请在冰豆网上搜索。
Highcharts说明文档
图表说明文档
一、元文件XML定义说明
1.Chart:
图表的通用属性
Margin:
边距是指图表的外边与图形区域之间的距离,数组分别代表上、右、下和左。
例子:
"50,50,100,50"
Inverted:
是否将X轴和Y轴进行调换,默认值为false
ZoomType:
拖动鼠标时,指定此图是沿着什么轴进行放大,例如zoomType:
'x'沿着X轴放大,依次类推
Polar:
Polar为true,则可将图转成极地图,默认是:
false.
Type:
指定绘制区所要绘制的图的类型,例如:
type=bar为柱图,type=line为线图
BorderWidth:
图表边框宽度。
默认宽度为0。
BorderColor:
外图表区域的边框颜色。
默认是:
#4572A7.
BorderRadius:
外图表区域边框圆角。
默认是:
5.
BackgroundColor:
外图表区域的背景颜色或渐变。
默认是:
#FFFFFF.
PlotBackgroundColor:
绘制图形区域边框颜色,默认是:
#C0C0C0.
SpacingTop:
图的上边框和绘图区之间的距离,默认是:
10.
SpacingBottom:
图的底边框和绘图区之间的距离,默认是:
15.
MarginLeft:
左边距,单位PX,
MarginRight:
右边距,单位PX
2.Exporting:
导出功能相关属性
Enabled:
导出模块是否可用
Width:
导出图片的宽度
Filename:
导出图片的名字
3.Legend:
图例说明
Enabled:
图例开关。
默认是:
true.
Align:
图例容器(中的图例)水平对齐在图表区,合法值有"left","center"和"right".默认是:
center
VerticalAlign:
垂直对齐。
能取"top","middle"or"bottom"之一。
BackgroundColor:
背景色
BorderColor:
边框颜色
BorderRadius:
边框圆角半径
BorderWidth:
边框线宽
Floating:
图例容器是否可以浮动,当此值设置为false时,图例是不可在数据区域图之上,它们是不可重叠的,而设成true,则可。
默认是:
false.
Layout:
图例数据项的布局。
布局类型:
水平或垂直。
默认是:
水平"horizontal"or"vertical".
Margin:
整个图例区的外边距。
如果整个图型区的大小是自动计算得出并且图例不浮动,那么图例边距的空间是指整个图例与坐标轴标签或者图形区之间的距离。
默认值是:
15
ItemWidth:
每个图例项的宽度。
当图例有很多图例项,并且用户想要这些图例项在同一平面内垂直对齐,此时这个属性可帮用户实现此效果
Reversed:
倒转。
默认是:
false
Rtl:
图例符号是否在文本右边。
默认是:
false.
X:
整个图例X轴偏移量,它是相对于水平布局定下后,chart.spacingLeft和chart.spacingRight.的空间左右移动,当x值为负值时,图例朝左移动;正值时,图例朝右移动。
Y:
整个图例垂直偏移量,它是相对于垂直布局定下后,chart.spacingTop和chart.spacingBottom的空间垂直移动,当y值为负值时,图例朝上移动;正值时,图例朝下移动。
Title:
图例说明标题(见Title说明)
4. Title or Subtitle:
标题及其副标题
Enabled:
是否可见;
Align:
水平布局方式;center,left,right;
Text:
标题文本;
VerticalAlign:
垂直布局方式;top,middle,bottom
X:
水平X的偏移量
Y:
水平Y的偏移量
Style:
样式(见Style说明)
Offset:
偏移量,默认值15。
5.Tooltip:
数据提示框。
当鼠标悬停在某点上时,以框的形式提示该点的数据,比如该点的值,数据单位等。
Style:
样式(见Style说明)
Enabled:
是否可见;
BackgroundColor:
背景色
BorderColor:
提示边框的颜色
BorderRadius:
边框圆角半径,默认值3
BorderWidth:
边框宽度,默认值1
Crosshairs:
十字准线,如:
Crosshairs="true,true"第一个值表示是否与X轴有准线连接,第二个值表示是否与Y轴有准线连接。
Shared:
提示框文本显示有序数据(不包括饼图,散点图和标志图(flag)等)的系列类型将被显示在单一的气泡中。
ValueDecimals:
数据提示框数据值小数保留位数。
默认为保留所有小数。
ValuePrefix:
附加到序列Y值的前缀。
ValueSuffix:
附加到序列Y值的后缀。
XDateFormat:
如果X轴是时间轴,格式化提示框标题中的日期。
6.Axis:
坐标轴(包括XAxis,YAxis)
所有的图表除了饼图都有X轴和Y轴,默认情况下,x轴显示在图表的底部,y轴显示在左侧(多个y轴时可以是显示在左右两侧),通过设置chart.inverted=true可以让x,y轴显示位置对调。
下图为图表中坐标轴组成部分
Id:
轴的id。
可以在图表渲染后,通过chart.get()获得;
Type:
坐标轴的类型。
可以是"linear","logarithmic"(对数轴),"datetime"或者"category"之一。
默认是:
linear(线性轴).
Logarithmic:
对数
AllowDecimals:
轴的刻度是否允许出现小数。
AlternateGridColor:
相间的网格列颜色。
当设置了此属性,网格中会隔列显示该颜色;
Categories:
类别名称,['Apples','Bananas','Oranges']
CategoriesPropertyName:
坐标轴类别所对应的属性名称
EndOnTick:
结束于标线;是否强制轴线在标线处结束。
默认值为true
GridLineColor:
绘图区域网格线颜色
GridLineDashStyle:
绘图区域网格线样式,实线:
solid虚线:
longdash
GridLineWidth:
绘图区域网格线宽度
LineColor:
轴本身线的颜色;
LineWidth:
轴本身线的宽度,默认值为1;
LinkedTo:
指向本轴的另一个轴的索引。
当一个轴指向主轴时,它将有和主轴一样的极端值,但是通过min,max或setExtremes可以更改。
Max:
轴的最大值
Min:
轴的最小值。
如果是null,最小值被自动计算
MinTickInterval:
坐标轴的值允许的最小刻度间隔。
比如缩放轴用来显示每天的数据时可以用来阻止轴上显示小时的时间。
MinorGridLineColor:
次级网格线的颜色,默认是:
#E0E0E0.
MinorGridLineDashStyle:
次级网格线的风格,网格线的线条风格样式,见(DashStyle)
MinorGridLineWidth:
次级网格线的宽度,默认是:
1.
MinorTickColor:
次级刻度线的颜色
MinorTickInterval:
次刻度线的间隔。
在一个直线轴中,如果设置为"auto",次刻度间隔计算为刻度线间隔的五分之一。
如果设置为null,次刻度刻度线不显示。
MinorTickLength:
次级刻度线的长度
MinorTickPosition:
次级刻度线相对于轴线的位置,可取值为:
inside和outside
MinorTickWidth:
次级刻度线的宽度
Opposite:
是否在正常显示的对立面显示轴。
正常是垂直坐标轴显示在左边,水平坐标轴显示在底部,因此对立面就是垂直坐标轴显示在右边和水平坐标轴显示在顶部,这通常用于有两个或多个坐标轴。
Reversed:
是否逆转轴,使得最高数最靠近原点。
如果图表倒置,x轴默认是逆转的。
Offset:
标题到轴线的距离;
ShowEmpty:
当坐标轴没有数据时是否显示轴线和标题。
默认值为true
StartOnTick:
是否强制轴线在标线处开始。
使用此选项与maxPadding来控制
TickInterval:
坐标轴上的刻度线的单位间隔。
当值为null时,刻度线间隔是根据近似于线性的(tickPixelInterval)计算的。
TickPosition:
刻度线相对于轴线的位置,可以取的值为inside和outside
TickLength:
刻度线的长度
TickWidth:
刻度线的宽度
TickColor:
主刻度线的颜色
TickmarkPlacement:
仅适用于类别轴。
如果设置为on刻度线位于在类别名称的中心,如果设置为between刻度线位于类别名称之间。
如果刻度线间隔数为1,其默认值是between,否则默认只是on。
Labels:
轴标签,(显示在刻度上的数值或者分类名称),见Label。
Title:
坐标轴标题,显示在轴线旁。
见Title。
StackLabels:
栈标签显示堆栈列或条形图中每个栏位的总值。
属性见Label。
Y轴属性。
PlotLines:
通过颜色线横贯在绘图区域上标记轴中的一个特定值。
见PlotLines。
PlotBands:
通过彩色带横贯在绘图区域上做成的表示在轴线上的间距。
见PlotBands。
7.Series:
数据列(数据列是一组数据集合,例如一条线,一组柱形等。
图表中所有点的数据都来自数据列对象)
BindProperty:
绑定属性名
DrillEnable:
是否支持钻取
DrillDataInfo:
ISDO,钻取数据信息,服务端使用
Type:
图表类型
Name:
对应的图例
Data:
服务端用
Visible:
可见性
XAxis:
使用的X轴
Index:
见zIndex。
LegendIndex:
序列中的各图在图例中的顺序
Stack:
是否是堆积图
YAxis:
使用的Y轴
ShowInLegend:
是否在图例中显示
Color:
可以通过series.color来指定数据列的颜色
Size:
饼图大小
Center:
饼图圆心
DashStyle:
线条样式
8.PlotOptions:
数据点配置
1)Type="Line"(直线图)orType="Spline"(曲线图)
AllowPointSelect:
设置是否允许通过点击节点标记、条带、切片,选择数据列的节点。
通过设置allowPointSelect=true可以使数据点可选择
Animation:
Highcharts图表默认是以动画的形式展现图形加载过程的
Cursor:
cursor属性可以指定鼠标形状"pointer",即指定当鼠标悬停在数据列上时对应的鼠标样式(当配置了数据列点击事件时)。
DataLabels:
数据标签指的是在数据点上显示一些数据信息标签
Color:
颜色
ConnectEnds:
只用在极坐标图表中。
是否要跨越极端连接序列线的终端(series伴随数据指定)默认是:
true.
ConnectNulls:
是否跨过空的点链接图像线,默认是:
false.
DashStyle:
图表段划线样式的名字(见5)DashStyle)
LineWidth:
线的宽度,默认2;
Stacking:
null,normal,percent
Step:
left,centerandright线状图的步长折线
PointStart:
没有X轴坐标时,用来定义初始点坐标,与PointInterval一起使用。
PointInterval:
没有X轴坐标时,用来定义X轴的间距。
Marker:
标记数据点,见Marker。
States:
鼠标放上和选中点的样式。
见States。
2)Type="Column"(柱状图)orType="Bar"(条状图)
AllowPointSelect:
设置是否允许通过点击节点标记、条带、切片,选择数据列的节点。
Animation:
Highcharts图表默认是以动画的形式展现图形加载过程的
BorderColor:
column边框颜色
BorderWidth:
column边框宽度
BorderRadius:
column边框弧度
ColorByPoint:
否应该接受每系列的一种颜色或每点一种颜色
Colors:
颜色集合
Grouping:
每个柱之间彼此是否独立
Stacking:
(null,normal,percent)一个图表是否成为堆叠图,关键在于是否设置了stacking属性,堆叠图主要是针对柱状图和bar图而言的
NegativeColor:
负轴数据的颜色
MinPointLength:
最小数据值那一条柱子的长度(如果是0,可能看不到,可以设置出来)
PointStart:
没有X轴坐标时,用来定义初始点坐标,与PointInterval一起使用。
PointInterval:
没有X轴坐标时,用来定义X轴的间距。
3)Type="Pie"(饼状图)
AllowPointSelect:
设置是否允许通过点击节点标记、条带、切片,选择数据列的节点。
Animation:
Highcharts图表默认是以动画的形式展现图形加载过程的
BorderColor:
每片边缘的颜色。
BorderWidth:
每片边缘的宽度。
默认为1。
Center:
圆心,可以是像素坐标,也可以是百分比,['50%','50%']
Size:
直径大小,可以是百分比,也可以是像素。
InnerSize:
饼图的内径尺寸。
SlicedOffset:
切片偏离的像素
StartAngle:
x轴或测量轴的开始度数,以度数的方式给出
RowPieMaxCount:
每行饼图的最大个数。
4)Type="Area"(区域图)orType="Areaspline"(区域曲线图)
AllowPointSelect:
设置是否允许通过点击节点标记、条带、切片,选择数据列的节点。
通过设置allowPointSelect=true可以使数据点可选择
Animation:
Highcharts图表默认是以动画的形式展现图形加载过程的
Color:
颜色
ConnectNulls:
是否跨过空的点链接图像线,默认是:
false.
DashStyle:
图表段划线样式的名字(见5)DashStyle)
LineWidth:
线的宽度,默认2;
LineColor:
线的颜色
NegativeColor:
负轴数据的颜色
Stacking:
(null,normal,percent)是否成为堆叠图
FillColor:
区域填充色
FillOpacity:
透明度,默认值0.75.
5)Type="Scatter"散点图
AllowPointSelect:
设置是否允许通过点击节点标记、条带、切片,选择数据列的节点。
通过设置allowPointSelect=true可以使数据点可选择
Animation:
Highcharts图表默认是以动画的形式展现图形加载过程的
DataLabels:
数据标签指的是在数据点上显示一些数据信息标签
Color:
颜色
Cursor:
cursor属性可以指定鼠标形状"pointer",即指定当鼠标悬停在数据列上时对应的鼠标样式(当配置了数据列点击事件时)。
cropThreshold:
LineWidth:
连接分散点线的宽度
NegativeColor:
负轴数据的颜色
PointStart:
没有X轴坐标时,用来定义初始点坐标,与PointInterval一起使用。
PointInterval:
没有X轴坐标时,用来定义X轴的间距。
9.公共对象属性
1)Style
Color:
颜色
FontSize:
字体大小
FontFamily:
字体类型
FontWeight:
设置文本的粗细。
normal;bold
2)PlotLines
Color:
区域划分带的颜色
DashStyle:
区域划分线的风格
Id:
区域划分线ID
Value:
区域划分线坐标值
Width:
区域划分线宽度
ZIndex:
区域划分线的堆叠顺序
Label:
区域化分线的文本标签,见Label。
3)PlotBands
Color:
区域划分带的颜色
From:
区域划分带在轴上的起始位置。
Id:
区域划分带的id,一般在Axis.removePlotBand中起识别作用
To:
区域划分带在轴上的结束位置。
ZIndex:
区域划分带在z轴方向上的深度
4)Label
Align:
区域划分带文本标签的水平对齐方式,可以取的值:
“left”、“center”、“right”
VerticalAlign:
定义堆栈总标签的垂直对齐方式。
可以是一个"top","middle"or"bottom"。
在运行时计算的默认值取决于方向和堆栈是否是正的或负的。
Enabled:
可见性。
Rotation:
区域划分带的文本标签的旋转角度,默认为0
StaggerLines:
仅在水平轴使用,把标签分布在几行中,以增大或者缩小标签的空间。
Step:
每隔n个的标签显示在轴上。
设置step为n。
设置step为2,每隔1个显示标签。
X:
X坐标
Y:
Y坐标
ZIndex:
在z轴方向上的深度
Style:
区域划分带的文本标签的样式,见Style。
SoftConnector:
针对pie是否把连接线作为一个软弧线或者锐利的线来渲染
ConnectorPadding:
数据标签和饼图块之间的连接线的宽度
Distance:
数据标签到饼图边缘的距离
5)DashStyle
Solid、ShortDash、ShortDot、ShortDashDot、ShortDashDotDot、Dot、Dash、LongDash、DashDot、LongDashDot、LongDashDotDot
6)Marker
Enabled:
启用或禁用该点标记。
默认值为null。
数据密集时,标记隐藏。
FillColor:
标记填充色。
LineColor:
点标记的轮廓的颜色。
当使用空时,该系列或点的颜色。
默认#ffffff。
LineWidth:
点标记的轮廓的线宽度。
Radius:
点标记的半径。
默认为4。
Symbol:
为标记的预定义形状或符号。
"circle","square","diamond","triangle"and"triangle-down".默认值为null
States:
选定的点标记的外观,见States。
为了让这一点要选择,选择正确的设置Allowpointselect。
7)States
Hover:
鼠标放上时的状态。
见Hover
Select:
鼠标选中时的状态。
见Select
8)Hover:
各属性含义同Marker
Enabled:
FillColor:
LineColor:
LineWidth:
Radius:
9)Select:
各属性含义同Marker
Enabled:
FillColor:
LineColor:
LineWidth:
Radius:
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Highcharts 说明 文档