Object:街景/PanoramaOptions

PanoramaOptions 对象规范

街景类参数。

属性

名称	类型	说明
`pano`	`String`	场景点的唯一标识。
`pov`	`PanoPov`	修改场景的俯仰角。
`zoom`	`Number`	放大级别，值大于1小于4。
`visible`	`Boolean`	街景的显示/隐藏状态。
`scrollwheel`	`Boolean`	滚轮是否触发zoom改变的启用/停用状态。
`disableCompass`	`Boolean`	罗盘显示/隐藏状态。
`disableMove`	`Boolean`	移动箭头显示/隐藏状态。
`disableFullScreen`	`Boolean`	FLASH全屏控件显示/隐藏状态。
`addressControl`	`Boolean`	街景地址控件的初始启用/停用状态。
`addressControlOptions`	`PanoramaAddressControlOptions`	街景地址控件的初始化选项。
`photoTimeControl`	`Boolean`	街景拍摄时间控件的初始启用/停用状态。

实例

本示例中，介绍如何在div容器中创建街景

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,
        //显示移动箭头显示状态，false为显示，true为不显示
        disableMove: false,
        //隐藏罗盘显示状态，false为显示，true为不显示
        disableCompass: true,
        //设置鼠标滚轮的禁用状态，false为不可使用滚轮，默认为true
        scrollwheel: true,
        //设置显示街景地址控件，true为显示，默认为false，
        addressControl: true,
        //设置街景地址控件位置相对右上角对齐，向左排列
        addressControlOptions: {
            position: qq.maps.ControlPosition.TOP_RIGHT
        },
        //设置显示街景拍摄事件控件，true为显示，默认为false
        photoTimeControl: true
    });

}

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,
                //显示移动箭头显示状态，false为显示，true为不显示
                disableMove: false,
                //隐藏罗盘显示状态，false为显示，true为不显示
                disableCompass: true,
                //设置鼠标滚轮的禁用状态，false为不可使用滚轮，默认为true
                scrollwheel: true,
                //设置显示街景地址控件，true为显示，默认为false，
                addressControl: true,
                //设置街景地址控件位置相对右上角对齐，向左排列
                addressControlOptions: {
                    position: qq.maps.ControlPosition.TOP_RIGHT
                },
                //设置显示街景拍摄事件控件，true为显示，默认为false
                photoTimeControl: true
            });

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

</html>

新窗口打开在线试一试