2. 程式人生 > >（轉）OL2中設置鼠標的樣式

（轉）OL2中設置鼠標的樣式

阿新 • • 發佈：2017-06-09
format csdn 移動 初始 pbo led doc 代碼 detail

http://blog.csdn.net/gisshixisheng/article/details/49496289

概述：

在OL2中，鼠標默認是箭頭，地圖移動時，鼠標樣式是移動樣式；很多時候，為了形象起見，我們總是希望鼠標在地圖上的時候和移動地圖的時候鼠標的樣式不是默認的效果，本文講述如何實現這樣的效果。

實現方式：

通過下面的代碼實現修改鼠標樣式。

map.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");


在地圖初始化完成後，設置地圖的樣式，並添加map的move和moveend事件，實現的完整代碼如下：
 



[html] view plain copy
 
 print?


    

  1. <!DOCTYPE html>  
    2. 

  2. <html>  
    3. 

  3. <head lang="en">  
    4. 

  4.     <meta charset="UTF-8">  
    5. 

  5.     <title>openlayers map</title>  
    6. 

  6.     <link rel="stylesheet" href="http://localhost/olapi/theme/default/style.css" type="text/css">  
    7. 

  7.     <style>  
     
    8. 

  8.         html, body{  
    9. 

  9.             padding:0;  
    10. 

  10.             margin:0;  
    11. 

  11.             height:100%;  
    12. 

  12.             width:100%;  
    13. 

  13.             overflow: hidden;  
    14. 

  14.             font-size: 12px;  
    15. 

  15.         }  
    16. 

  16.         #map1{  
    17. 

  17.             width: 500px;  
    18. 

  18.             height: 500px;  
    19. 

  19.             float: left;  
    20.  
    

  20.             overflow: hidden;  
    21. 

  21.             border: 1px solid #f0e68c;  
    22. 

  22.         }  
    23. 

  23.     </style>  
    24. 

  24.     <script src="../../../plugin/OpenLayers-2.13.1/OpenLayers.js"></script>  
    25. 

  25.     <script src="../../../plugin/jquery/jquery-1.8.3.js"></script>  
    26. 

  26.     <script>  
    27. 

  27.         var map1;  
    28. 

  28.         $(function(){  
    29. 

  29.             var bounds = new OpenLayers.Bounds(  
    30. 

  30.                     73.45100463562233, 18.16324718764174,  
    31. 

  31.                     134.97679764650596, 53.531943152223576  
    32. 

  32.             );  
    33. 

  33.             var options = {  
    34. 

  34.                 controls: [],  
    35. 

  35.                 maxExtent: bounds,  
    36. 

  36.                 maxResolution: 0.2403351289487642,  
    37. 

  37.                 projection: "EPSG:4326",  
    38. 

  38.                 units: ‘degrees‘  
    39. 

  39.             };  
    40. 

  40.             map1 = new OpenLayers.Map(‘map1‘, options);  
    41. 

  41.             var wms = new OpenLayers.Layer.WMS(  
    42. 

  42.                     "Geoserver layers - Tiled",  
    43. 

  43.                     "http://localhost:8088/geoserver/lzugis/wms",  
    44. 

  44.                     {  
    45. 

  45.                         "LAYERS": "province",  
    46. 

  46.                         "STYLES": ‘‘,  
    47. 

  47.                         format: ‘image/png‘  
    48. 

  48.                     },  
    49. 

  49.                     {  
    50. 

  50.                         buffer: 0,  
    51. 

  51.                         displayOutsideMaxExtent: true,  
    52. 

  52.                         isBaseLayer: true,  
    53. 

  53.                         yx : {‘EPSG:4326‘ : true}  
    54. 

  54.                     }  
    55. 

  55.             );  
    56. 

  56.             map1.addLayer(wms);  
    57. 

  57.             map1.addControl(new OpenLayers.Control.Zoom());  
    58. 

  58.             map1.addControl(new OpenLayers.Control.Navigation());  
    59. 

  59.             map1.zoomToExtent(bounds);  
    60. 

  60.   
    61. 

  61.             map1.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");  
    62. 

  62.             map1.events.register("move", map1, function(){  
    63. 

  63.                 map1.layerContainerDiv.style.cursor = ("url(img/closedhand.cur),default");  
    64. 

  64.             });  
    65. 

  65.             map1.events.register("moveend", map1, function(){  
    66. 

  66.                 map1.layerContainerDiv.style.cursor = ("url(img/openhand.cur),default");  
    67. 

  67.             });  
    68. 

  68.         });  
    69. 

  69.     </script>  
    70. 

  70. </head>  
    71. 

  71. <body>  
    72. 

  72. <div id="map1"></div>  
    73. 

  73. </body>  
    74. 

  74. </html>  
    75. 

（轉）OL2中設置鼠標的樣式
   
 
 
 
 

            
  

           

              
              

            

            
相關推薦

			   
            
            
            
 

    


    
    
（轉）OL2中設置鼠標的樣式

     
 format   csdn   移動   初始   pbo   led   doc   代碼   detail   http://blog.csdn.net/gisshixisheng/article/details/49496289
概述：
在OL2中，鼠標默認是箭頭，地圖移動時，鼠標樣式是移動樣式；很 



  
 

    


    
    
（轉）Linux中設置服務自啟動的三種方式

     
 情況下   level   httpd   sysv   kconfig   clas   mage   com   ssh   有時候我們需要Linux系統在開機的時候自動加載某些腳本或系統服務
主要用三種方式進行這一操作：
ln -s                       在/etc/rc.d/rc 



  
 

    


    
    
使用CefSharp在.Net程序中嵌入Chrome瀏覽器（二）——參數設置

     
 個性化   cache   .html   下一個   back   下一步   init   false   family   原文:使用CefSharp在.Net程序中嵌入Chrome瀏覽器（二）——參數設置在實現了.Net程序中嵌入Chrome瀏覽器後，下一步的個性化操作就是加入一些設置了，在前面的文章 



  
 

    


    
    
（轉）Scala中協變(+)、逆變(-)、上界(<:)、下界(>:)簡單介紹

     
 定義類   word   ref   一個   pla   而不是   關系   repl   協變   看源碼的時候看到：
trait ExtensionId[T <: Extension] {沒見過這個符號啊<:
Scala上界(<:)和下界(>:)
 
1） U >: T
 



  
 

    


    
    
（轉）Android中Parcelable接口用法

     
 string   date   場景   應用   用法   反序列化   數組   auth   序列化對象   1. Parcelable接口
Interface for classes whose instances can be written to and restored from a Parce 



  
 

    


    
    
（轉）Java 中關於String的空對象(null) ,空值(empty)，空格

     
 空值   ise   als   內存   ati   調用   ext   cor   under   原文出處：Java 中關於String的空對象(null) ,空值(empty)，空格 
定義 空對象： String s = null; 空對象是指定義一個對象s，但是沒有給該對象分配空間，即沒有實例化 



  
 

    


    
    
Linux入門（一）root密碼設置和用戶切換

     
 root   三種方式   變量   blog   log   div   ubun   普通   終端   從這學期開始，本人將會親自開一個Linux 專題學習包括Linux 常用命令，常見問題的一些解決方法，以及Linux系統下C和C++一些學習經驗
下面這張圖片是首次安裝Ubuntu後第一次設置root 



  
 

    


    
    
（轉）JavaScript中==和===的區別

     
 嚴格   布爾型   就是   相同   script   scrip   ===   bsp   true   ==   用於比較   判斷 兩者相等      ==在比較的時候可以轉自動換數據類型
 
===用於嚴格比較   判斷兩者嚴格相等     ===嚴格比較，不會進行自動轉換，要求進行比較的操作數 



  
 

    


    
    
H3C室外無線AP（WA4320X）胖瘦切換設置方法

     
 無線   AP   H3C   固件   刷新       因客戶有一臺H3C的WA4320X無線AP是有胖、瘦切換的功能，但在出廠時默認為瘦模式，無線AP上並沒有兩種模式的切換開關，打電話給廠家說是刷新固件才能支持為胖模式。於是我使用串口線連接AP上的console口進行調試。    1、查看一下無線AP當 



  
 

    


    
    
（轉）Python中如何理解if __name__ == '__main__'

     
 面向   知識   about   main   想要   二進制   imp   space   包導入   摘要
通俗的理解 __name__ == ‘__main__‘ ：假如你叫李凱.py，在朋友眼中，你是李凱( __name__ == ‘李凱‘ )；在你自己眼中，你是你自己( __name__ == 



  
 

    


    
    
keras 序貫（Sequential）模型 常見設置

     
 tail   情感   href   http   optimizer   .net   square   hyper   預測   最近看了一些例子，keras在預測方面，Sequential 常見搭配如下

情感分析
embedding -> lstm -> dense
embedding 主 



  
 

    


    
    
（轉）Linux 中/etc/profile、~/.bash_profile 環境變量配置及執行過程

     
 行修改   你在   關系   轉載   登錄用戶   後者   nbsp   inux   第一個   環境變量是和Shell緊密相關的，用戶登錄系統後就啟動了一個Shell。對於Linux來說一般是bash，但也可以重新設定或切換到其它的 Shell。對於UNIX，可能是CShelll。環境變量是通過Sh 



  
 

    


    
    
（轉）ArcGIS中如何將大量座標點按順序連線成線或面

     
  
 
 
  
   ArcGIS中如何將大量座標點按順序連線成線
    
  
  
   
     
     
     
   
  
 
 
 
          工作過程中，如果獲 



  
 

    


    
    
（轉）Linux 中/etc/profile、~/.bash_profile 環境變數配置及執行過程

     
 環境變數是和Shell緊密相關的，使用者登入系統後就啟動了一個Shell。對於Linux來說一般是bash，但也可以重新設定或切換到其它的 Shell。對於UNIX，可能是CShelll。環境變數是通過Shell命令來設定的，設定好的環境變數又可以被所有當前使用者所執行的程式所使用。對於bash這個Shell 



  
 

    


    
    
（轉）JAVA中的堆疊

     
  
 
  
                         &nb 



  
 

    


    
    
掌握ConstraintLayout（十）按比例設置視圖大小

     
 約束   技術分享   content   strong   自定義view   不同的   支持   -c   源碼   有時候在布局界面的時候，UI要求某個View或者某張圖片按比例顯示，以適應不同的屏幕分辨率。
通常我們時通過自定義View或者引入第三方的庫來解決。現在我們既然已經使用了Constrai 



  
 

    


    
    
（轉）Python中的X[:,0]、X[:,1]、X[:,:,0]、X[:,:,1]、X[:,m:n]和X[:,:,m:n]

     
 
                      Python中對於陣列和列表進行切片操作是很頻繁的，當然對於切片的操作可供我們直接使用的函式也是很遍歷了，我們今天主要簡單總結一下常用集中索引化方式，希望對大家有所幫助吧。    

      對於列表的切片比較簡單，在我之前的部落格裡面有詳細的講解，需要的話可 



  
 

    


    
    
（轉）URL中的hash（井號）

     
 
                

1.#的含義

#代表網頁中的一個位置，其右邊的字元，就是該位置的識別符號。比如

http://www.example.com/index.html#print

就是代表index.html中的print位置。瀏覽器會自動把print位置滾動到頁面可視區域內。

設定 



  
 

    


    
    
（轉）Eclipse中快速輸入System.out.println()的快捷鍵

     
  
  
   
     
   
   
   
    https://blog.csdn.net/ShiMengRan107/article/details/73614417
    
   
  
 
 
  
  善用 Eclipse 組合鍵，可以提高輸入效率。 
  Step1： Ec 



  
 

    


    
    
（轉）Thread中yield方法

     
 先上一段程式碼

public class YieldExcemple {

    public static void main(String[] args) {
        Thread threada = new ThreadA();
        Thread threadb = new Th