JavaScript API

LabelOptions 对象规范

Lable的参数。

属性

名称	类型	说明
clickable	Boolean	如果为true，表示可点击，默认true。
content	String	标签的文本。
map	Map	显示标签的地图。
offset	Size	相对于position位置偏移值，x方向向右偏移为正值，y方向向下偏移为正值，反之为负。
position	LatLng	标签位置坐标，若offset不设置，默认标签左上角对准该位置。
style	Object	Label样式，例如：
visible	Boolean	如果为true，表示标签可见，默认为true。
zIndex	Number	标签的z轴高度，zIndex大的标签，显示在zIndex小的前面。

实例

本示例中，介绍多边形覆盖物参数使用

<!DOCTYPE html>
<html>
 
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>文本标记的参数</title>
    <style type="text/css">
        * {
            margin: 0px;
            padding: 0px;
        }
        body,
        button,
        input,
        select,
        textarea {
            font: 12px/16px Verdana, Helvetica, Arial, sans-serif;
        }
        #info {
            width: 603px;
            padding-top: 3px;
            overflow: hidden;
        }
        .btn {
            width: 93px;
        }
    </style>
    <script charset="utf-8" src="https://map.qq.com/api/js?v=2.exp&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77"></script>
 
</head>
 
<body onload="init()">
    <div style="width:603px;height:300px" id="container"></div>
    <div id="info" style="margin-top:10px;">
        <button id="mapM" class="btn">setMap</button>
        <button id="setP" class="btn">setPosition</button>
        <button id="content" class="btn">setContent</button>
        <button id="visibleF" class="btn">setVisible</button>
        <button id="cssSty" class="btn">setStyle</button>
    </div>
    <script>
        var init = function() {
            var center = new qq.maps.LatLng(39.916527, 116.397128);
            var map = new qq.maps.Map(document.getElementById('container'), {
                center: center,
                zoom: 13
            });
            var cssC = {
                color: "#f00",
                fontSize: "16px",
                fontWeight: "bold"
            };
            var label = new qq.maps.Label({
                //如果为true，表示可点击，默认true。
                clickable: true,
 
                //标签的文本。
                content: '文本标注',
 
                //显示标签的地图。
                map: map,
 
                //相对于position位置偏移值，x方向向右偏移为正值，y方向向下偏移为正值，反之为负。
                offset: new qq.maps.Size(15, 0),
 
                //标签位置坐标，若offset不设置，默认标签左上角对准该位置。
                position: center,
 
                //Label样式。
                style: cssC,
 
                //如果为true，表示标签可见，默认为true。
                visible: true,
 
                //标签的z轴高度，zIndex大的标签，显示在zIndex小的前面。
                zIndex: 1000
 
            });
        }
    </script>
</body>
 
</html>

在线试一试

这篇文章对您解决问题是否有帮助？

已解决

未解决