ytu_map
/
index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>烟大地图-Leaflet</title>
        <link rel="stylesheet" href="./css/leaflet.css" />
        <link rel="stylesheet" href="./css/main.css" />
    </head>
    <body>
        <!-- 搜索 -->
        <div class="search-container">
            <div class="search-input">
                <input
                    type="输入关键字进行检索"
                    class="search-input-inner"
                    placeholder="输入名称进行搜索"
                />
            </div>
            <div class="search-result">
                <ul></ul>
            </div>
        </div>

        <!-- 图层工具 -->
        <div class="layer-control-container">
            <div class="layer-control-switch" onclick="toggleLayerControl(this)">
                <img src="./assets/icons/layer.svg" status="close" width="30px" id="layer-switch" />
            </div>
            <div class="control-content">
                <div class="trace-control">
                    <div class="title">
                        <h1>轨迹</h1>
                    </div>
                    <div class="trace-control-content">
                        <!-- 轨迹回放 -->
                        <div class="trace-way">
                            <select
                                id="trace"
                                onchange="handleTraceChoosed()"
                                placeholder="请选择轨迹"
                            >
                                <option value="undefined">未选择</option>
                                <option speed="60">宿舍-图书馆</option>
                                <option speed="60">图书馆-七餐</option>
                                <option speed="30">宿舍-五教</option>
                                <option speed="50">宿舍-一餐</option>
                                <option speed="15">七餐-宿舍</option>
                                <option speed="40">宿舍-机房</option>
                                <option speed="50">机房-七餐</option>
                            </select>
                        </div>
                        <div class="btns">
                            <button onclick="redrawTrace()">开始</button>
                            <button onclick="pauseOrPlay()" id="controlBtn" type="pause">
                                暂停
                            </button>
                            <button onclick="stopTrace()">停止</button>
                        </div>
                    </div>
                </div>
                <!-- 图层聚焦 -->
                <div class="layer-focus">
                    <div class="title">
                        <h1>图层聚焦</h1>
                    </div>
                    <div class="layer-focus-content">
                        <button onclick="locateLayer('diningRoom')">餐厅</button>
                        <button onclick="locateLayer('academicBuildings')">教学楼</button>
                        <button onclick="locateLayer('dormitory')">宿舍</button>
                        <button onclick="locateLayer('lake')">三元湖</button>
                    </div>
                </div>
                <!-- 图层显隐控制 -->
                <div class="layer-control-content"></div>
            </div>
        </div>
        <div id="map"></div>
    </body>
    <script>
        const baseServer = '/map'
    </script>
    <script src="./js/menu.js"></script>
    <script src="./js/turf5.min.js"></script>
    <script src="./js/leaflet.js"></script>
    <script src="./plugin/patternUtils.js"></script>
    <script src="./plugin/symbol.js"></script>
    <script src="./plugin/polylineDecorator.js"></script>
    <script src="./plugin/moving-marker.js"></script>
    <script src="./js/handler.js"></script>
    <script src="./js/util.js"></script>
    <script src="./js/variable.js"></script>
    <script src="./js/colorizer.js"></script>
    <script src="./js/index.js"></script>
</html>