首页 > 教程 > 前端技术 > 二开教程

    收藏

    Destoon添加百度地图自动标注
    DT模板2016-09-16二开教程132℃
    广告
    核心提示:修改方法:修改模板-》Homepage-contact.htm在{php $map_height = 300;}{php @include DT_ROOT.'/api/map/'.$api_map.'/show.inc.php';} 之后加上以下代码:{else}{php $coname = urlencode($COM[company]);}{php $uaddress = urlencode($COM[address]);}{php $uarea = urlen
    修改方法:
    修改模板-》Homepage->contact.htm

    {php $map_height = 300;}
    {php @include DT_ROOT.'/api/map/'.$api_map.'/show.inc.php';}
    之后加上以下代码:
    {else}
    {php $coname = urlencode($COM[company]);}
    {php $uaddress = urlencode($COM[address]);}
    {php $uarea = urlencode($aa[areaname]);}
    <div class="main_head"><div><strong>公司地图</strong><a name="map"></a></div></div>
    <div class="main_body">
    下图中的红点是{$COM[company]}在{$aa[areaname]}的具体位置,您可以用鼠标放大缩小
    <iframe style="margin:6px;" width="720" height="300" src="http://www.dtmuban.com/skin/taomodi/image/nopic.gif" frameborder="0" scrolling="no"></iframe>
    </div>
    附map.php内容:
    <?php ?><html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <style type="text/css">
    body, html,#allmap {width: 720px;height: 300px;overflow: hidden;margin:0;}
    * {font-size:12px;}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=1a9c001b5696345a8a35d25f577a877b"></script>
    <title>地址解析</title>
    </head>
    <body>
    <div id="allmap"></div>
    </body>
    </html>
    <script type="text/javascript">
    var opts = {
    width : 250, // 信息窗口宽度
    height: 50, // 信息窗口高度
    title : "<b><? echo $_GET['gongsi']; ?></b>" // 信息窗口标题
    }
    //var infoWindow = new BMap.InfoWindow('鹤山区中山北路二矿南(鹤壁市鹤山区东方牧业总场院内)', opts); // 创建信息窗口对象
    var infoWindow = new BMap.InfoWindow('(<? echo $_GET['dizhi']; ?>)', opts); // 创建信息窗口对象
    // 百度地图API功能
    var map = new BMap.Map("allmap");
    var point = new BMap.Point(116.331398,39.897445);
    map.centerAndZoom(point,15);
    // 创建地址解析器实例
    map.enableScrollWheelZoom(); //启用滚轮放大缩小。
    map.enableDoubleClickZoom(); //启用双击放大。
    var myGeo = new BMap.Geocoder();
    // 将地址解析结果显示在地图上,并调整地图视野

    myGeo.getPoint("<? echo $_GET['dizhi']; ?>", function(point){
    if (point) {
    map.centerAndZoom(point, 15);
    var marker = new BMap.Marker(point); // 创建标注
    map.clearOverlays();
    map.addOverlay(marker);
    marker.openInfoWindow(infoWindow); // 打开信息窗口
    map.addOverlay(new BMap.Marker(point));

    }
    }, "<? echo $_GET['chengshi']; ?>");
    function showinfo(zb) {
    var mapobj = mapArray[zb];
    var point = new BMap.Point(mapobj.x, mapobj.y);
    map.centerAndZoom(point, 14);
    var infoWindow = new BMap.InfoWindow(mapobj.newstext, opts); // 创建信息窗口对象
    var marker = new BMap.Marker(point); // 创建标注
    map.clearOverlays();
    map.addOverlay(marker);
    marker.openInfoWindow(infoWindow); // 打开信息窗口
    marker.addEventListener("dragend", function(e){
    this.openInfoWindow(infoWindow);
    infoWindow.redraw();
    })
    marker.addEventListener("click", function(e){
    this.openInfoWindow(infoWindow);
    infoWindow.redraw();
    })
    }</script>
 
  • 文本链接:https://mbtxw.com/Course/show.php?itemid=87
  • 文章来源:模板模板
  • 版权声明:除非特别标注,否则均为本站原创文章,转载时请以链接形式注明文章出处。
0相关评论

    QQ交流群

    模板天下网QQ群

  • 欢迎DT爱好者加群学习交流:68503649

    联系关注

  • MBTXW.COM腾讯微博
  • 536205792QQ号
  • 68503649加QQ群
  • 536205792@qq.com客服邮箱