Class: ScaleBar

control~ScaleBar(options)

比例尺控件。用来表示图上距离与实地距离的关系。控件宽度代表图上像素范围，文字描述实地距离。
当地图倾斜的时候，比例尺控件反映地图中心维度线的比例尺。（因为近大远小的透视规则，所以不能代表全部）

Summary

Methods:

activate	激活比例尺控件。
deactivate	禁用比例尺控件，禁用后比例尺控件的文字描述及比例尺长度不随地图缩放发生改变
destroy	销毁控件，释放占用的内存。
getControlType	返回控件的类型
setBarClass	设置比例尺控件刻度条样式类名。
setBarStyle	设置比例尺控件刻度条样式。
setTextClass	设置比例尺控件文本样式类名。
setTextStyle	设置比例尺控件文本样式。

Constructor

new ScaleBar(options)

Parameters:

Name Type Description

options

Object

可选项

Name	Type	Description
`scaleTextStyle`	String	文字的CSS样式，优先级高于scaleTextClass。scaleTextStyle和scaleTextClass均不指定，则使用默认样式："width: 100%;height: 20px;text-align: center"。
`scaleTextClass`	String	文字的CSS样式类名，例："scale-text"，优先级低于scaleTextStyle。如果css属性需要高于style，对具体属性使用 !important 提升优先级
`scaleBarStyle`	String	刻度条的CSS样式，优先级高于scaleBarClass。scaleBarStyle和scaleBarClass均不指定，则使用默认样式："width: 100%; height: 3px; background-color: #cccccc"。
`scaleBarClass`	String	刻度条的CSS样式类名，例："scale-bar"，优先级低于scaleBarStyle。如果css属性需要高于style，对具体属性使用!important提升优先级

Example

let scaleBar = new hmap.control.ScaleBar({
    "scaleTextStyle":'width: 100%;height: 20px;text-align: center;color:#ff0000',
    "scaleBarStyle":'width: 100%; height: 3px; background-color: #cccccc'
});

Methods

activate()

激活比例尺控件。

Example

scaleBar.activate();

deactivate()

禁用比例尺控件，禁用后比例尺控件的文字描述及比例尺长度不随地图缩放发生改变

Example

scaleBar.deactivate();

destroy()

销毁控件，释放占用的内存。

Example

scaleBar.destroy();

getControlType() → {String}

返回控件的类型

Returns:

String -

控件类型的名称

setBarClass(className)

设置比例尺控件刻度条样式类名。

Parameters:

Name	Type	Description
`className`	String	要设置的css样式类名

Example

.scale-bar {
    margin-bottom: 20px;
    width: 100%;
    height: 5px;
    background-color: #fc9804;
}
scaleBar.setBarClass('scale-bar')

setBarStyle(style)

设置比例尺控件刻度条样式。

Parameters:

Name	Type	Description
`style`	String	要设置的css样式字符串

Example

scaleBar.setBarStyle('width:100%;height:3px;background-color:green;')

setTextClass(className)

设置比例尺控件文本样式类名。

Parameters:

Name	Type	Description
`className`	String	要设置的css样式类名

Example

.scale-text {
    margin-bottom: 30px;
    width: 100%;
    height: 20px;
    text-align: center;
    color: #fc9804;
}
scaleBar.setTextClass('scale-text')

setTextStyle(style)

设置比例尺控件文本样式。

Parameters:

Name	Type	Description
`style`	String	要设置的css样式字符串

Example

scaleBar.setTextStyle('width:100%;height:20px;text-align:left;color:green;')