zoukankan      html  css  js  c++  java
  • 百度地图开发-绘制点线提示框 07

    上一篇推文简单介绍了与地图的交互,如移动,缩放,点击,截图等功能,都是很常见的业务。接下来就让我们一起学习在地图上面打点,标注信息,绘制线和面等功能。

    标记点、绘制线、面、增加提示信息

    关于在百度地图上绘制点的功能,其实有很大的作用,比如我们在地图中查询饭店,满足要求的都可以用标记点的形式展示出来,用户可以一目了然的看到具体位置。同时如果可以在标记的点上添加对应饭店的弹窗信息,那么用户就更能清晰的看到。

    点标记

    点标记用来在地图上标记任何位置,例如用户位置、车辆位置、店铺位置等一切带有位置属性的事物。

    添加点标记

        //取得当前的位置
        LatLng point=new LatLng(currentLocation.getLatitude(),currentLocation.getLongitude());
        //构建Marker图标
        BitmapDescriptor bitmap= BitmapDescriptorFactory.fromResource(R.drawable.flag);
        //在地图上添加Marker并显示
        mBaiduMap.addOverlay(new MarkerOptions().position(point).icon(bitmap));
    

    点击添加标记后,就可以在当前位置处添加标记信息。

    标记点

    对于Marker,百度官方还是给的自定义权限挺高的,可以对其进行设置图标、动画类型、透明度、是否可拖拽、标题等都可进行调整,根据需求进行自定义操作。同时教程说还可对标记点增加点击和拖拽事件。

    绘制线

    根据对应的教程写法,可以实现绘制折线、虚线、分段颜色绘制线、分段纹理绘制线,通过整个功能可以绘制各种各样的规划路线或物体轨迹。

        //构建折线点坐标
        LatLng p1 = new LatLng(39.077218, 117.072102);
        LatLng p2 = new LatLng(39.007423, 117.110989);
        LatLng p3 = new LatLng(39.077218, 117.172345);
        List<LatLng> points = new ArrayList<LatLng>();
        points.add(p1);
        points.add(p2);
        points.add(p3);
    
        //设置折线的属性
        OverlayOptions mOverlayOptions = new PolylineOptions()
                  .width(10)
                  .color(0xAAFF0000)
                  .points(points);
        //在地图上绘制折线
        Overlay mPolyline = mBaiduMap.addOverlay(mOverlayOptions);
    

    绘制线

    对于线的属性有多种可供设置的,常用属性如下:color颜色、width宽度、Points坐标列表、colorsvalues分段颜色值列表、extralnfo额外信息等都是可以进行调整的。

    也可以添加线的点击事件,当某些场合需要点击绘制的路线时可以使用。

    对于绘制这块还可以绘制弧线,绘制多边形,绘制圆等可以参考百度地图教程自己按需进行实现即可。

    接下来添加文字和信息窗,其实也就是弹窗信息。

    文字覆盖物

    其实就是在地图的某一个点,来用文字来进行表示

     LatLng ll=new LatLng(39.077218,117.072102);
     OverlayOptions mTextOptions=new TextOptions().text("阿辉最牛逼")
        .bgColor(0xAAFFFF00) //背景色
        .fontSize(24) //字号
        .fontColor(0xFFFF00FF) //文字颜色
        .rotate(-30) //旋转角度
        .position(ll);
      Overlay mText=mBaiduMap.addOverlay(mTextOptions);
    

    阿辉最牛逼

    添加信息框

    这块教程中说了两种方式可以实现信息框的显示,一种是使用View构造InfoWindow另一种是使用BitmpDescriptor构造InfoWindow。我们这里简单实现下第一种即可。

        //添加信息框
        Button button=new Button(getApplicationContext());
        button.setBackgroundResource(R.drawable.flag);
        button.setText("你好阿辉");
        LatLng p1 = new LatLng(39.007423, 117.110989);
        mBaiduMap.showInfoWindow(new InfoWindow(button,p1,-100));
    

    弹出框

    这里我只是临时找了一个图片来弹出框的底图的,先把功能实现了再说。大家在使用的过程中要做一些好看一点的图,这样子软件的整体美观就提高了。

    基本上和地图的交互就介绍到这里,目前只是简单的说了说比较常用的,至于一些细节功能还是需要去看看百度的官方文档,虽然我对那文档不是很感冒。

    对了提醒大家一句,多看DEMO,它比官方文档教程强太多了。

    小寄语

    人生短暂,我不想去追求自己看不见的,我只想抓住我能看的见的。

    原创不易,给个关注。

    我是阿辉,感谢您的阅读,如果对你有帮助,麻烦点赞、转发 谢谢。

    作者:阿辉
    关注我:微信扫描下面二维码,关注后6T编程资料免费送。
    微信公众号:Andy阿辉
    写一些程序员的所思所想,希望对你有帮助。

    版权声明:本文版权归作者和博客园共有,欢迎转载,
    但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利.
  • 相关阅读:
    隐藏win10中“此电脑”里的6个子文件夹
    k2安装LEDE
    ubuntu下用apt-get安装lamp缺少mcrypt , curl
    Devexpress TreeList选择父级联动
    iPhone10.3.X越狱后SSH连接不上的问题(已解决)
    C#保存Base64格式图片
    PHP服务器文件管理器开发小结(九):jQuery动态表单实现文件下载
    利用Content-disposition实现无刷新下载图片文件
    jQuery多文件下载
    参考资料
  • 原文地址:https://www.cnblogs.com/netxiaohui/p/15209286.html
Copyright © 2011-2022 走看看