2台机子 krpano 视角同步鼠标拖动同步

shangguwang

已于 2023-12-05 10:52:27 修改

阅读量116

点赞数

文章标签： javascript 开发语言 ecmascript

于 2023-12-04 23:32:42 首次发布

本文链接：https://blog.csdn.net/shangguwang/article/details/134796509

版权

vrshow.js为启动函数文件

增加视角监听函数：

var krpanoAbc = null;
var socket = null;
const isctr = getQueryParam('isctr');
console.log(isctr)

//获取URL参数
function getQueryParam(paramName) {
	const urlParams = new URLSearchParams(window.location.search);
	return urlParams.get(paramName);
}
//监听视角以及鼠标拖动，并发送websocket消息
function myviewchange(vlookat, hlookat, fov) {
	if (isctr == 1)  {
		socket.emit("Broadcast", {
			type: 'ViewSet',
			data: { vlookat, hlookat, fov }
		});
	}
}
//接收websocket消息改变视角
function ViewSet(arg)
{
	if (!krpanoAbc) {
		krpanoAbc = document.getElementById('krpanoSWFObject');
	}
	if (krpanoAbc){
		krpanoAbc.set("view.hlookat", arg.data.hlookat );
		krpanoAbc.set("view.vlookat", arg.data.vlookat );
		krpanoAbc.set("view.fov", arg.data.fov );
	}
}
function socketInit(){
   var url = `ws://127.0.0.1:3008`;
    socket = io.connect(url, {
        reconnectionAttempts: 30000000,
        query: {
            type: 'browser'
        }
    });
    socket.on('Broadcast', (obj) => {
        if (obj.sender != socket.id) {
            ViewSet(obj.data);
        }
    });
    socket.on('connect', () => {
        console.log(socket.id, '已连接！');
    });
}
socketInit();

在tour.xml中添加视角监听函数

<events onviewchange="myviewchange()" />
<action name="myviewchange">js(myviewchange(get(view.vlookat),get(view.hlookat),get(view.fov)));</action>
//更改控制模式
<action name="startup" autorun="onstart">
    skin_changecontrolmode();
</action>