zoukankan      html  css  js  c++  java
  • 百度地图折线事件示例

    
    
    鼠标移到折线上显示信息窗,移除时隐藏信息窗


    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <style type="text/css">
            body, html {
                width: 100%;
                height: 100%;
                margin: 0;
                font-family: "微软雅黑";
            }
    
            #allmap {
                height: 500px;
                width: 100%;
            }
    
            #control {
                width: 100%;
            }
        </style>
        <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=1nCQCnDr3Nt3GKDVeBmKGe2Y"></script>
        <title>设置线、面可编辑</title>
    </head>
    <body>
        <div id="allmap"></div>
        <div id="control">
            <button onclick="polyline.enableEditing();polygon.enableEditing();">开启线、面编辑功能</button>
            <button onclick="polyline.disableEditing();polygon.disableEditing();">关闭线、面编辑功能</button>
        </div>
    </body>
    </html>
    <script type="text/javascript">
        // 百度地图API功能
        var map = new BMap.Map("allmap");
        map.centerAndZoom(new BMap.Point(116.404, 39.915), 15);
        map.enableScrollWheelZoom();
    
        var opts = {
             200,     // 信息窗口宽度
            height: 100,     // 信息窗口高度
            title: "海底捞王府井店", // 信息窗口标题
            enableMessage: true,//设置允许信息窗发送短息
            message: "亲耐滴,晚上一起吃个饭吧?戳下面的链接看下地址喔~"
        }
        var infoWindow = new BMap.InfoWindow("地址:北京市东城区王府井大街88号乐天银泰百货八层", opts);
    
        var polyline = new BMap.Polyline([
            new BMap.Point(116.399, 39.910),
            new BMap.Point(116.405, 39.920),
            new BMap.Point(116.423493, 39.907445)
        ], { strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0.5 });   //创建折线
        map.addOverlay(polyline);   //增加折线
        polyline.addEventListener("mouseover", function (e) {
            //alert(type.point);
            map.openInfoWindow(infoWindow, e.point);
            e.currentTarget.setStrokeWeight(5);
        });
        polyline.addEventListener("mouseout", function (e) {
            e.currentTarget.setStrokeWeight(2);
            infoWindow.close();
        });
    </script>
  • 相关阅读:
    UVA 1660 Cable TV Network
    UVA 1149 Bin Packing
    UVA 1610 Party Games
    UVA 12545 Bits Equalizer
    UVA 11491 Erasing and Winning
    UVA 1611 Crane
    DataTable循环删除行
    SqlBulkCopy使用心得 (大量数据导入)
    JQuery选择器大全
    java学习--GUI3
  • 原文地址:https://www.cnblogs.com/weiweictgu/p/4828156.html
Copyright © 2011-2022 走看看