项目中需要根据点击时候点击的内容,输入百度地图查找并展示规划等相关功能

 

于是封装了一个单独的百度map的html页面以供调用

 

功能包括了

①展示底图

②切换卫星图,切换卫星路线图,切换普通地图

③通过百度js对自身进行定位并标注

④根据输入的内容查找地点,并可生成当前位置到目标位置的线路规划

⑤任意两点生成线路规划

⑥清除标注

⑦跳转到百度地图官方页面或打开app进行导航

⑧展示线路规划

 

使用了自己封装的工具 lyhFloatTip:链接如下:

 

代码如下:

  <script src="./../static/tools/tipsTools/lyh-tip-float.js"></script>

    
     
        
      
            
       
        路线规划
       
        
      
    
     
    
     
        
      
            
                   
       
            
                   
       
                
                        
        
                    
                                                                     
        
                
                        
        
                    
                                  搜索                                        
         步/骑                    
         公交                    
         驾车                
        
            
       
            
                   
       
                
                                                        
       
            
                   
       
                
                             我                                
                             清除标注                            
       
            
                   
       
                
        步/骑路线                
        公交路线                
        驾车路线                
        自定义路线开启            
       
            
                   
       
                
        百度APP导航            
       
        
      
    
     
    
         
     

 

效果如下图:

 

 

 

 

 

 

 

 

 以上...