微信小程序---实现VR看房效果

1、前言

        客户需求需要实现VR看房功能。使用技术为微信小程序+spring boot。

2、工具

        ① 下载PtGui绘制全景图工具：https://www.jb51.net/softs/743790.html

        ② 下载Pannellum :https://pannellum.org/download/

3、前端页面

   

 使用web-view标签，src为后端页面地址，id为自定义参数

4、后端方法

html代码

    
    
    
    <#include "${rc.contextPath}/framework/importAdminLTE.html"/>
    //引入pannellum的js和css文件
    
    
    



//创建div放全景图

//接收前端的id 用来指定显示哪一张图片

controller层代码

@Controller
@RequestMapping("/test")
public class pageController {

    @RequestMapping("/test1")
    public ModelAndView test1(@RequestParam(value ="id", required = false) String id) {
        ModelAndView mv = new ModelAndView();
        JSONObject json = new JSONObject();
        json.put("id",id);
        mv.addObject("data",json);
        mv.setViewName("test/test1");
        return mv;
    }
}

5、其他

        pannellum的使用方法参考官网：潘内勒姆 (pannellum.org)

        全景图制作参考官网：照片拼接软件360度全景图像软件 - PTGui拼接软件

欢迎交流讨论