renyicun
/
ZhongMianAdmin


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
							<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />

        <title>Document</title>
        <link rel="stylesheet" href="//at.alicdn.com/t/font_2596172_0md2x29bfl5e.css" />
        <style>
            html,
            body {
                width: 100%;
                height: 100%;
                margin: 0;
                overflow: hidden;
            }
            .scene {
                height: 100%;
                float: left;
                width: 50%;
                /* width: 100%; */
                height: 100%;
            }
            .control {
                pointer-events: all;
                display: flex;
                align-items: center;
                justify-content: space-around;
                height: 34px;
                border-radius: 17px;
                background-color: rgba(0, 0, 0, 0.3);
                position: absolute;
                bottom: 10px;
                left: 10px;
                z-index: 1000;
            }
            .control div {
                position: relative;
                margin-left: 20px;
                margin-right: 20px;
                cursor: pointer;
            }
            .control div i {
                font-size: 18px;
                color: #fff;
            }
        </style>
    </head>
    <body>
        <div id="scene" class="scene">
            <div class="control">
                <div>
                    <!-- icon-show_roaming_selected -->
                    <i onclick="changeMode('panorama')" class="iconfont icon-show_roaming_normal"></i>
                </div>
                <div>
                    <i onclick="changeMode('floorplan')" class="iconfont icon-show_plane_normal"></i>
                </div>
                <div>
                    <i onclick="changeMode('dollhouse')" class="iconfont icon-show_3d_normal"></i>
                </div>
            </div>
        </div>
        <div id="scene2" class="scene"></div>
        <script src="../dist/sdk/kankan-sdk-deps.js"></script>
        <script src="../dist/sdk/kankan-sdk.js"></script>
        <script>
            var kankan = new KanKan({
                dom: '#scene',
                num: 't-YhBCzQr',
            })
            kankan.render()
            var kankan2 = new KanKan({
                dom: '#scene2',
                num: 't-YhBCzQr' // 't-YjFjyUz',
            })
            kankan2.render()

            // kankan.Broadcast.FollowScreen.on('data', data => {
            //     console.log('kankan1', data)
            //     kankan2.Broadcast.FollowScreen.receive(data)
            // })
            // kankan.Broadcast.FollowScreen.start()

            // kankan2.Broadcast.FollowScreen.on('data', data => {
            //     console.log('kankan2', data)
            // })
            // kankan2.Broadcast.FollowScreen.start({ follow: true })

            function changeMode(mode) {
                kankan.Camera[mode]()
                kankan2.Camera[mode]()
            }
        </script>
    </body>
</html>