Question

我想在 spring boot 项目中显示 potree 的 html 页面（包含点云）。我将 html 页面放在文件夹模板中，将另外两个文件夹（libs 和 pointclouds）放在静态文件夹 like this 中。

问题是：点云没有显示，它给了我一个页面like this

出现错误：加载资源失败：服务器响应状态为 500()

无法加载 r

OctreeLoader.js:146 RangeError: 数组长度无效

at NodeLoader.parseHierarchy (OctreeLoader.js:161)
at NodeLoader.loadHierarchy (OctreeLoader.js:257)
at async NodeLoader.load (OctreeLoader.js:32)

这是我的 html 页面：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="author" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>Potree Viewer</title>

    <link rel="stylesheet" type="text/css" href="/libs/potree/potree.css">
    <link rel="stylesheet" type="text/css" href="/libs/jquery-ui/jquery-ui.min.css">
    <link rel="stylesheet" type="text/css" href="/libs/openlayers3/ol.css">
    <link rel="stylesheet" type="text/css" href="/libs/spectrum/spectrum.css">
    <link rel="stylesheet" type="text/css" href="/libs/jstree/themes/mixed/style.css">
</head>

<body>
    <script src="/libs/jquery/jquery-3.1.1.min.js"></script>
    <script src="/libs/spectrum/spectrum.js"></script>
    <script src="/libs/jquery-ui/jquery-ui.min.js"></script>
    <script src="/libs/other/BinaryHeap.js"></script>
    <script src="/libs/tween/tween.min.js"></script>
    <script src="/libs/d3/d3.js"></script>
    <script src="/libs/proj4/proj4.js"></script>
    <script src="/libs/openlayers3/ol.js"></script>
    <script src="/libs/i18next/i18next.js"></script>
    <script src="/libs/jstree/jstree.js"></script>
    <script src="/libs/potree/potree.js"></script>
    <script src="/libs/plasio/js/laslaz.js"></script>
    
    <!-- INCLUDE ADDITIONAL DEPENDENCIES HERE -->
    <!-- INCLUDE SETTINGS HERE -->
    
    <div class="potree_container" style="position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; ">
        <div id="potree_render_area" style="background-image: url('../build/potree/resources/images/background.jpg');"></div>
        <div id="potree_sidebar_container"> </div>
    </div>
    
    <script>
    
        window.viewer = new Potree.Viewer(document.getElementById("potree_render_area"));
        
        viewer.setEDLEnabled(true);
        viewer.setFOV(60);
        viewer.setPointBudget(2_000_000);
    //  <!-- INCLUDE SETTINGS HERE -->
        viewer.loadSettingsFromURL();
        
        viewer.setDescription("");
        
        viewer.loadGUI(() => {
            viewer.setLanguage('en');
            $("#menu_appearance").next().show();
            $("#menu_tools").next().show();
            $("#menu_clipping").next().show();
            viewer.toggleSidebar();
        });
        
        

        Potree.loadPointCloud("/pointclouds/page_test_4/metadata.json", "page_test_4", e => {
            let scene = viewer.scene;
            let pointcloud = e.pointcloud;
            
            let material = pointcloud.material;
            material.size = 1;
            material.pointSizeType = Potree.PointSizeType.ADAPTIVE;
            material.shape = Potree.PointShape.SQUARE;
            material.activeAttributeName = "rgba";
            
            scene.addPointCloud(pointcloud);
            
            viewer.fitToScreen();
        });

        
        
    </script>
    
    
  </body>
</html>

这是我的控制器：

@Autowired
@GetMapping("/page_test_4")
public String page_test_4(){
    return "page_test_4";
}

由于未找到多部分边界，请求被拒绝：SPring Boot

0 个答案: