出行规划专属地图

源代码编辑器
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>昆明五一4天旅游攻略</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
        }
        body {
            background-color: #f5f7fa;
            color: #333;
            line-height: 1.6;
        }
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
        }
        header {
            text-align: center;
            margin-bottom: 30px;
            padding: 20px 0;
            background: linear-gradient(135deg, #1e9cff, #3665ff);
            color: white;
            border-radius: 10px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        }
        header h1 {
            font-size: 2.5rem;
            margin-bottom: 10px;
        }
        header p {
            font-size: 1.2rem;
            opacity: 0.9;
        }
        .weather-section {
            background-color: white;
            padding: 20px;
            border-radius: 10px;
            margin-bottom: 30px;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
        }
        .weather-title {
            font-size: 1.5rem;
            margin-bottom: 15px;
            color: #3665ff;
            border-bottom: 2px solid #f0f0f0;
            padding-bottom: 10px;
        }
        .weather-cards {
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap;
            gap: 15px;
        }
        .weather-card {
            flex: 1;
            min-width: 200px;
            background: linear-gradient(to bottom, #f9f9f9, #f0f0f0);
            padding: 15px;
            border-radius: 8px;
            text-align: center;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
        }
        .weather-card h3 {
            margin-bottom: 10px;
            color: #3665ff;
        }
        .weather-icon {
            font-size: 2rem;
            margin: 10px 0;
        }
        .temp {
            font-size: 1.2rem;
            font-weight: bold;
        }
        .itinerary-section {
            margin-bottom: 30px;
        }
        .day-container {
            background-color: white;
            border-radius: 10px;
            margin-bottom: 30px;
            overflow: hidden;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
        }
        .day-header {
            background: linear-gradient(135deg, #36b5ff, #3665ff);
            color: white;
            padding: 15px 20px;
            font-size: 1.3rem;
        }
        .day-content {
            padding: 20px;
        }
        .spot-cards {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            margin-top: 15px;
        }
        .spot-card {
            flex: 1;
            min-width: 250px;
            max-width: 350px;
            background-color: #f9f9f9;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s;
        }
        .spot-card:hover {
            transform: translateY(-5px);
        }
        .spot-img {
            width: 100%;
            height: 180px;
            object-fit: cover;
        }
        .spot-info {
            padding: 15px;
        }
        .spot-name {
            font-size: 1.2rem;
            font-weight: bold;
            margin-bottom: 8px;
            color: #3665ff;
        }
        .spot-desc {
            font-size: 0.95rem;
            color: #666;
            margin-bottom: 10px;
        }
        .transportation {
            display: flex;
            align-items: center;
            margin: 20px 0;
            padding: 15px;
            background-color: #f5f7fa;
            border-radius: 8px;
        }
        .transportation-icon {
            font-size: 1.5rem;
            margin-right: 15px;
            color: #3665ff;
        }
        .map-section {
            background-color: white;
            padding: 20px;
            border-radius: 10px;
            margin-bottom: 30px;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
        }
        .map-title {
            font-size: 1.5rem;
            margin-bottom: 15px;
            color: #3665ff;
            border-bottom: 2px solid #f0f0f0;
            padding-bottom: 10px;
        }
        .map-container {
            height: 500px;
            border-radius: 8px;
            overflow: hidden;
            position: relative;
        }
        .map-legend {
            position: absolute;
            bottom: 20px;
            left: 20px;
            padding: 10px;
            background: rgba(255,255,255,0.9);
            border-radius: 5px;
            box-shadow: 0 2px 6px rgba(0,0,0,0.3);
            z-index: 100;
            font-size: 12px;
            max-width: 200px;
        }
        .taxi-links {
            margin-top: 15px;
        }
        .taxi-btn {
            display: inline-block;
            background: linear-gradient(135deg, #ff9900, #ff6600);
            color: white;
            padding: 10px 15px;
            border-radius: 5px;
            text-decoration: none;
            font-weight: bold;
            margin-right: 10px;
            margin-bottom: 10px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }
        footer {
            text-align: center;
            padding: 20px;
            color: #666;
            font-size: 0.9rem;
        }
        .tips-section {
            background-color: white;
            padding: 20px;
            border-radius: 10px;
            margin-bottom: 30px;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
        }
        .tips-title {
            font-size: 1.5rem;
            margin-bottom: 15px;
            color: #3665ff;
            border-bottom: 2px solid #f0f0f0;
            padding-bottom: 10px;
        }
        .tips-content ul {
            padding-left: 20px;
        }
        .tips-content li {
            margin-bottom: 10px;
        }
        .amap-marker-label {
            border: 0;
            background-color: transparent;
        }
        .amap-info-content {
            padding: 0 !important;
            border-radius: 6px !important;
            box-shadow: 0 2px 10px rgba(0,0,0,0.2) !important;
            border: none !important;
        }
        @media (max-width: 768px) {
            .weather-cards, .spot-cards {
                flex-direction: column;
            }
            .spot-card {
                max-width: 100%;
            }
            .map-legend {
                bottom: 10px;
                left: 10px;
                padding: 8px;
                font-size: 10px;
                max-width: 150px;
            }
        }
    </style>
</head>
<body>
    <div class="container">
        <header>
            <h1>昆明五一4天旅游攻略</h1>
            <p>感受春城的魅力，探索自然与文化的完美融合</p>
        </header>

        <section class="weather-section">
            <h2 class="weather-title">五一期间昆明天气预报</h2>
            <div class="weather-cards">
                <div class="weather-card">
                    <h3>5月1日</h3>
                    <div class="weather-icon">☀️</div>
                    <p>白天: 晴</p>
                    <p>夜间: 晴</p>
                    <p class="temp">温度: 28°C/16°C</p>
                    <p>风力: 西风 1-3级</p>
                </div>
                <div class="weather-card">
                    <h3>5月2日</h3>
                    <div class="weather-icon">☀️</div>
                    <p>白天: 晴</p>
                    <p>夜间: 多云</p>
                    <p class="temp">温度: 29°C/13°C</p>
                    <p>风力: 北风 1-3级</p>
                </div>
                <div class="weather-card">
                    <h3>5月3日</h3>
                    <div class="weather-icon">🌧️</div>
                    <p>白天: 小雨</p>
                    <p>夜间: 小雨</p>
                    <p class="temp">温度: 22°C/14°C</p>
                    <p>风力: 北风 1-3级</p>
                </div>
                <div class="weather-card">
                    <h3>5月4日</h3>
                    <div class="weather-icon">🌤️</div>
                    <p>白天: 多云</p>
                    <p>夜间: 多云</p>
                    <p class="temp">温度: 24°C/15°C</p>
                    <p>风力: 北风 1-3级</p>
                </div>
            </div>
        </section>

        <section class="tips-section">
            <h2 class="tips-title">旅行小贴士</h2>
            <div class="tips-content">
                <ul>
                    <li><strong>最佳旅游季节：</strong>昆明四季如春，全年均适合旅游，但3月-6月和9月-11月气候最宜人。</li>
                    <li><strong>防晒准备：</strong>昆明海拔较高，紫外线强烈，请做好防晒措施。</li>
                    <li><strong>高原反应：</strong>昆明海拔约1900米，部分人可能有轻微高原反应，请适当休息。</li>
                    <li><strong>当地特色：</strong>过桥米线、汽锅鸡、宣威火腿、野生菌等是当地特色美食。</li>
                    <li><strong>交通方式：</strong>市内可乘坐公交、地铁或打车，前往郊区景点可选择包车或参加一日游。</li>
                    <li><strong>手机应用：</strong>建议下载高德地图，可方便查看路线和打车。本攻略中提供的链接点击后可直接在高德地图中打开。</li>
                </ul>
            </div>
        </section>

        <section class="map-section">
            <h2 class="map-title">旅游路线地图</h2>
            <div class="map-container" id="container"></div>
            <div style="margin-top: 20px; text-align: center;">
                <a href="amapuri://workInAmap/createWithToken?polymericId=mcp_1629b01b49ff4c14bddec3a54e5881c1&from=MCP" class="taxi-btn" style="font-size: 1.2rem; padding: 15px 25px;">
                    <span style="margin-right: 10px;">📍</span>在高德地图App中查看完整行程
                </a>
            </div>
        </section>

        <section class="itinerary-section">
            <div class="day-container">
                <div class="day-header">
                    <h2>Day 1: 昆明市区游 (5月1日)</h2>
                </div>
                <div class="day-content">
                    <p>第一天以昆明市区游为主，感受春城的独特魅力。</p>
                    
                    <div class="spot-cards">
                        <div class="spot-card">
                            <img src="https://store.is.autonavi.com/showpic/f3ab0d1d1db211982bcbc47cbe987ef2" alt="云南省博物馆" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">云南省博物馆</h3>
                                <p class="spot-desc">云南省规模最大的综合性博物馆，包含丰富的云南历史文化和民族文物。</p>
                                <p>建议游览时间：2小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/0325e7d95977ba015a886ac96e24b188" alt="云南民族村" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">云南民族村</h3>
                                <p class="spot-desc">呈现云南26个民族的建筑、服饰和民俗风情，是了解云南民族文化的窗口。</p>
                                <p>建议游览时间：3小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/6598448af0604a9b337201c78a73054c" alt="滇池" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">滇池海埂公园</h3>
                                <p class="spot-desc">昆明最著名的湖泊，可欣赏美丽的湖光山色，还有著名的红嘴鸥。</p>
                                <p>建议游览时间：2小时</p>
                            </div>
                        </div>
                    </div>

                    <div class="transportation">
                        <div class="transportation-icon">🚕</div>
                        <div>
                            <h3>景点间交通</h3>
                            <p>景点之间可打车前往，单程约15-20分钟。</p>
                            <div class="taxi-links">
                                <a href="iosamap://path?sourceApplication=applicationName&sid=&slat=&slon=&sname=&did=&dlat=25.037304&dlon=102.721511&dname=云南省博物馆&dev=0&t=0" class="taxi-btn">打车去云南省博物馆</a>
                                <a href="iosamap://path?sourceApplication=applicationName&sid=&slat=&slon=&sname=&did=&dlat=24.966060&dlon=102.660893&dname=云南民族村&dev=0&t=0" class="taxi-btn">打车去云南民族村</a>
                                <a href="iosamap://path?sourceApplication=applicationName&sid=&slat=&slon=&sname=&did=&dlat=24.961819&dlon=102.665688&dname=滇池海埂公园&dev=0&t=0" class="taxi-btn">打车去滇池海埂公园</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="day-container">
                <div class="day-header">
                    <h2>Day 2: 石林一日游 (5月2日)</h2>
                </div>
                <div class="day-content">
                    <p>第二天前往世界自然遗产——石林，感受大自然的鬼斧神工。</p>
                    
                    <div class="spot-cards">
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/5a69524e1f7a9e753cfc4374468c9b63" alt="石林风景区" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">石林风景区</h3>
                                <p class="spot-desc">世界自然遗产，拥有奇特的喀斯特地貌，石峰林立，景色壮观。</p>
                                <p>建议游览时间：4-5小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/849b09ca27389cb32bf1af4d0b4ab2eb" alt="石林胜境" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">石林胜境</h3>
                                <p class="spot-desc">石林风景区内的精华景点，石柱形态各异，极为壮观。</p>
                                <p>建议游览时间：1-2小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="https://aos-comment.amap.com/B03670XRRH/comment/44a0e4696200b1cdc13d5da63550f0dc_2048_2048_80.jpg" alt="小石林景区" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">小石林景区</h3>
                                <p class="spot-desc">石林景区内的另一景点，较为安静，景色别具一格。</p>
                                <p>建议游览时间：1-2小时</p>
                            </div>
                        </div>
                    </div>

                    <div class="transportation">
                        <div class="transportation-icon">🚕</div>
                        <div>
                            <h3>前往石林</h3>
                            <p>昆明市区到石林约86公里，驾车需要约1.5小时。推荐包车或参加一日游。</p>
                            <div class="taxi-links">
                                <a href="iosamap://path?sourceApplication=applicationName&sid=&slat=25.037304&slon=102.721511&sname=昆明市区&did=&dlat=24.812964&dlon=103.325701&dname=石林风景区&dev=0&t=0" class="taxi-btn">从昆明市区打车去石林</a>
                                <a href="amapuri://drive/takeTaxi?sourceApplication=amapplatform&slat=25.037304&slon=102.721511&sname=昆明市区&dlon=103.325701&dlat=24.812964&dname=石林风景区" class="taxi-btn">高德打车去石林</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="day-container">
                <div class="day-header">
                    <h2>Day 3: 九乡风景区 (5月3日)</h2>
                </div>
                <div class="day-content">
                    <p>第三天前往九乡风景区，探索神秘的溶洞世界。</p>
                    
                    <div class="spot-cards">
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/8001b658c8114aa973f9507552813d93" alt="九乡风景区" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">九乡风景区</h3>
                                <p class="spot-desc">中国最大的溶洞群，融洞、河、湖、瀑、峡等景观为一体，被誉为"溶洞博物馆"。</p>
                                <p>建议游览时间：4-5小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/eb5790e34b9afd4fd9ff109d162a889e" alt="荫翠峡" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">荫翠峡</h3>
                                <p class="spot-desc">九乡风景区内的精华景点，峡谷内溪水潺潺，植被茂密。</p>
                                <p>建议游览时间：1小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/2c59dfe33183beb9724981ce02bb4259" alt="叠虹桥" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">叠虹桥景区</h3>
                                <p class="spot-desc">九乡风景区内的溶洞景区，以自然天成的石桥闻名。</p>
                                <p>建议游览时间：1小时</p>
                            </div>
                        </div>
                    </div>

                    <div class="transportation">
                        <div class="transportation-icon">🚕</div>
                        <div>
                            <h3>前往九乡</h3>
                            <p>昆明市区到九乡约96公里，驾车需要约1.5小时。推荐包车或参加一日游。</p>
                            <div class="taxi-links">
                                <a href="iosamap://path?sourceApplication=applicationName&sid=&slat=25.037304&slon=102.721511&sname=昆明市区&did=&dlat=25.081027&dlon=103.379754&dname=九乡风景区&dev=0&t=0" class="taxi-btn">从昆明市区打车去九乡</a>
                                <a href="amapuri://drive/takeTaxi?sourceApplication=amapplatform&slat=25.037304&slon=102.721511&sname=昆明市区&dlon=103.379754&dlat=25.081027&dname=九乡风景区" class="taxi-btn">高德打车去九乡</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="day-container">
                <div class="day-header">
                    <h2>Day 4: 西山与官渡古镇 (5月4日)</h2>
                </div>
                <div class="day-content">
                    <p>最后一天游览西山，欣赏昆明全景。</p>
                    
                    <div class="spot-cards">
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/ffe50e18ecc3314225c876b0717ef923" alt="西山风景区" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">西山风景区</h3>
                                <p class="spot-desc">可俯瞰整个昆明市和滇池，素有"睡美人"之称。</p>
                                <p>建议游览时间：3-4小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/da543b4686486b2e6cdfa34033327c4c" alt="龙门" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">龙门</h3>
                                <p class="spot-desc">西山风景区的精华景点，可俯瞰滇池全景。</p>
                                <p>建议游览时间：1小时</p>
                            </div>
                        </div>
                        
                        <div class="spot-card">
                            <img src="http://store.is.autonavi.com/showpic/9badea547d784f320b6944744a55988a" alt="官渡古镇" class="spot-img">
                            <div class="spot-info">
                                <h3 class="spot-name">官渡古镇</h3>
                                <p class="spot-desc">昆明历史最悠久的古镇之一，有着浓郁的历史文化氛围。</p>
                                <p>建议游览时间：2小时</p>
                            </div>
                        </div>
                    </div>

                    <div class="transportation">
                        <div class="transportation-icon">🚕</div>
                        <div>
                            <h3>景点间交通</h3>
                            <p>西山距离市区约22公里，驾车需要约40分钟。官渡古镇位于市区东南方向。</p>
                            <div class="taxi-links">
                                <a href="iosamap://path?sourceApplication=applicationName&sid=&slat=25.037304&slon=102.721511&sname=昆明市区&did=&dlat=24.964622&dlon=102.628595&dname=西山风景区&dev=0&t=0" class="taxi-btn">从市区打车去西山</a>
                                <a href="iosamap://path?sourceApplication=applicationName&sid=&slat=24.964622&slon=102.628595&sname=西山风景区&did=&dlat=24.961819&dlon=102.665688&dname=官渡古镇&dev=0&t=0" class="taxi-btn">从西山打车去官渡古镇</a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <footer>
            <p>© 2025 昆明五一旅游攻略 | 制作时间: 2025年4月</p>
        </footer>
    </div>

    <script>
        window.onload = function() {
            // 加载高德地图API
            var url = 'https://webapi.amap.com/maps?v=2.0&key=您申请的key值';
            var jsapi = document.createElement('script');
            jsapi.charset = 'utf-8';
            jsapi.src = url;
            document.head.appendChild(jsapi);

            jsapi.onload = function() {
                initMap();
            };
        }

        function initMap() {
            // 创建地图实例
            var map = new AMap.Map('container', {
                zoom: 9,
                center: [102.832, 24.88], // 昆明中心位置
                viewMode: '3D',
                pitch: 30
            });

            // 创建Marker集合
            var dayColors = ['#3366FF', '#FF6633', '#33CC66', '#9966FF'];
            
            // 第一天标记
            var day1Markers = [
                {position: [102.721511, 25.037304], title: '云南省博物馆', content: '<div>Day 1: 云南省博物馆</div>'},
                {position: [102.660893, 24.966060], title: '云南民族村', content: '<div>Day 1: 云南民族村</div>'},
                {position: [102.665688, 24.961819], title: '滇池海埂公园', content: '<div>Day 1: 滇池海埂公园</div>'}
            ];

            // 第二天标记
            var day2Markers = [
                {position: [102.721511, 25.037304], title: '昆明市区', content: '<div>Day 2: 昆明市区(出发点)</div>'},
                {position: [103.325701, 24.812964], title: '石林风景区', content: '<div>Day 2: 石林风景区</div>'}
            ];

            // 第三天标记
            var day3Markers = [
                {position: [102.721511, 25.037304], title: '昆明市区', content: '<div>Day 3: 昆明市区(出发点)</div>'},
                {position: [103.379754, 25.081027], title: '九乡风景区', content: '<div>Day 3: 九乡风景区</div>'}
            ];

            // 第四天标记
            var day4Markers = [
                {position: [102.721511, 25.037304], title: '昆明市区', content: '<div>Day 4: 昆明市区(出发点)</div>'},
                {position: [102.628595, 24.964622], title: '西山风景区', content: '<div>Day 4: 西山风景区</div>'},
                {position: [102.665688, 24.961819], title: '官渡古镇', content: '<div>Day 4: 官渡古镇</div>'}
            ];

            // 添加标记并绘制路线
            addMarkersAndPath(map, day1Markers, dayColors[0], 'Day 1: 昆明市区游');
            addMarkersAndPath(map, day2Markers, dayColors[1], 'Day 2: 石林一日游');
            addMarkersAndPath(map, day3Markers, dayColors[2], 'Day 3: 九乡风景区');
            addMarkersAndPath(map, day4Markers, dayColors[3], 'Day 4: 西山与官渡古镇');

            // 添加图例
            addLegend(map, dayColors);
        }

        function addMarkersAndPath(map, markerData, color, dayTitle) {
            var markers = [];
            var path = [];

            // 创建标记
            markerData.forEach(function(item, index) {
                var marker = new AMap.Marker({
                    position: item.position,
                    title: item.title,
                    map: map,
                    icon: new AMap.Icon({
                        size: new AMap.Size(24, 24),
                        image: 'https://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-' + (index + 1) + '.png',
                        imageSize: new AMap.Size(24, 24)
                    })
                });

                // 信息窗体
                var infoWindow = new AMap.InfoWindow({
                    content: '<div style="padding:10px;font-size:14px;color:' + color + '">' + 
                            '<b>' + dayTitle + '</b><br/>' +
                            item.title + '</div>',
                    offset: new AMap.Pixel(0, -30),
                    autoMove: true,
                    closeWhenClickMap: true
                });

                marker.on('click', function() {
                    infoWindow.open(map, marker.getPosition());
                });

                markers.push(marker);
                path.push(item.position);
            });

            // 创建路线
            if (path.length > 1) {
                var polyline = new AMap.Polyline({
                    path: path,
                    isOutline: true,
                    outlineColor: '#ffffff',
                    borderWeight: 2,
                    strokeColor: color,
                    strokeWeight: 5,
                    strokeStyle: 'solid',
                    strokeOpacity: 0.9,
                    zIndex: 50,
                    map: map
                });
            }
        }

        function addLegend(map, colors) {
            // 创建图例控件
            var legend = document.createElement('div');
            legend.className = 'map-legend';
            legend.style.cssText = '';
            
            var html = '<div style="font-weight:bold;margin-bottom:5px;">行程路线</div>';
            
            var days = ['Day 1: 昆明市区游', 'Day 2: 石林一日游', 'Day 3: 九乡风景区', 'Day 4: 西山与官渡古镇'];
            
            days.forEach(function(day, i) {
                html += '<div style="margin:3px 0;"><span style="display:inline-block;width:20px;height:3px;background:' + 
                       colors[i] + ';margin-right:5px;vertical-align:middle;"></span>' + day + '</div>';
            });
            
            legend.innerHTML = html;
            document.getElementById('container').appendChild(legend);
        }
    </script>
</body>
</html> 
控制台
清空
返回顶部示例中心常见问题智能客服公众号
二维码