Object:街景/PanoramaAddressControlOptions

PanoramaAddressControlOptions 对象规范

街景地址控件的参数。

属性

名称	类型	说明
`position`	`ControlPosition`	设置控件位置

实例

本示例中，介绍如何设置街景地址控件位置属性

JavaScript

var init = function() {
    // 创建街景
    var pano = new qq.maps.Panorama(document.getElementById('pano_holder'), {
        //设置默认的场景
        pano: '10051001111220105028000',
        //设置查看视角
        pov: {
            heading: 20,
            pitch: 15
        },
        //设置缩放级别，0<zoom<5
        zoom: 1,
        //设置显示街景地址控件，true为显示，默认为false，
        addressControl: true,
        //设置街景地址控件位置相对右上角对齐，向左排列
        addressControlOptions: {
            //设置缩放控件的位置相对右上角对齐，向下排列
            position: qq.maps.ControlPosition.RIGHT_TOP

            //设置缩放控件的位置为相对左上角对齐，向右排列
            //position: qq.maps.ControlPosition.TOP_LEFT

            //设置缩放控件的位置相对上方中间位置对齐
            //position: qq.maps.ControlPosition.TOP_CENTER

            //设置缩放控件的位置相对右上角对齐，向左排列
            //position: qq.maps.ControlPosition.TOP_RIGHT

            //设置缩放控件的位置相对左下角对齐，向右排列
            //position: qq.maps.ControlPosition.BOTTOM_LEFT

            //设置缩放控件的位置相对下方中间位置对齐
            //position: qq.maps.ControlPosition.BOTTOM_CENTER

            //设置缩放控件的位置相对右下角对齐，向左排列
            //position: qq.maps.ControlPosition.BOTTOM_RIGHT

            //设置缩放控件的位置相对左上角对齐，向下排列
            //position: qq.maps.ControlPosition.LEFT_TOP

            //设置缩放控件的位置相对左方中间位置对齐
            //position: qq.maps.ControlPosition.LEFT_CENTER

            //设置缩放控件的位置相对左下角对齐，向上排列
            //position: qq.maps.ControlPosition.LEFT_BOTTOM

            //设置缩放控件的位置相对右方中间位置对齐
            //position: qq.maps.ControlPosition.RIGHT_CENTER

            //设置缩放控件的位置相对右下角对齐，向上排列
            //position: qq.maps.ControlPosition.RIGHT_BOTTOM

            //设置缩放控件的位置中间位置对齐
            //position: qq.maps.ControlPosition.LEFT_CENTER
        }
    });

}

JavaScript+HTML

<!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;
        }
        p {
            width: 603px;
            padding-top: 3px;
            overflow: hidden;
        }
    </style>
    <script src="https://map.qq.com/api/js?v=2.exp&key=d84d6d83e0e51e481e50454ccbe8986b"></script>
</head>

<body onLoad="init()">
    <script>
        var init = function() {
            // 创建街景
            var pano = new qq.maps.Panorama(document.getElementById('pano_holder'), {
                //设置默认的场景
                pano: '10051001111220105028000',
                //设置查看视角
                pov: {
                    heading: 20,
                    pitch: 15
                },
                //设置缩放级别，0<zoom<5
                zoom: 1,
                //设置显示街景地址控件，true为显示，默认为false，
                addressControl: true,
                //设置街景地址控件位置相对右上角对齐，向左排列
                addressControlOptions: {
                    //设置缩放控件的位置相对右上角对齐，向下排列
                    position: qq.maps.ControlPosition.RIGHT_TOP

                    //设置缩放控件的位置为相对左上角对齐，向右排列
                    //position: qq.maps.ControlPosition.TOP_LEFT

                    //设置缩放控件的位置相对上方中间位置对齐
                    //position: qq.maps.ControlPosition.TOP_CENTER

                    //设置缩放控件的位置相对右上角对齐，向左排列
                    //position: qq.maps.ControlPosition.TOP_RIGHT

                    //设置缩放控件的位置相对左下角对齐，向右排列
                    //position: qq.maps.ControlPosition.BOTTOM_LEFT

                    //设置缩放控件的位置相对下方中间位置对齐
                    //position: qq.maps.ControlPosition.BOTTOM_CENTER

                    //设置缩放控件的位置相对右下角对齐，向左排列
                    //position: qq.maps.ControlPosition.BOTTOM_RIGHT

                    //设置缩放控件的位置相对左上角对齐，向下排列
                    //position: qq.maps.ControlPosition.LEFT_TOP

                    //设置缩放控件的位置相对左方中间位置对齐
                    //position: qq.maps.ControlPosition.LEFT_CENTER

                    //设置缩放控件的位置相对左下角对齐，向上排列
                    //position: qq.maps.ControlPosition.LEFT_BOTTOM

                    //设置缩放控件的位置相对右方中间位置对齐
                    //position: qq.maps.ControlPosition.RIGHT_CENTER

                    //设置缩放控件的位置相对右下角对齐，向上排列
                    //position: qq.maps.ControlPosition.RIGHT_BOTTOM

                    //设置缩放控件的位置中间位置对齐
                    //position: qq.maps.ControlPosition.LEFT_CENTER
                }
            });

        }
    </script>
    <div style="width:603px;height:300px" id="pano_holder"></div>
</body>

</html>

新窗口打开在线试一试