openlayers自用小笔记

当前级别  

map.getView().getZoom()

当前视野中

map.getView().getCenter()

map触发渲染映射--在渲染映射帧后触发   当地图加载    地图移动    时触发

        map.on('postrender', function(e) {
          
        });

interaction 交互

    DoubleClickZoom         双击缩放
    DragAndDrop             拖地车
    DragBox                 牵引箱
    DragPan                 龙盘
    DragRotate              拖动旋转
    DragRotateAndZoom       牵引旋转臂
    DragZoom                拖动缩放
    Draw                    绘制    //-----------------
    Extent                  范围
    Interaction             相互作用
    KeyboardPan             键盘面板
    KeyboardZoom            键盘缩放
    Modify                  修改    //------------------
    MouseWheelZoom          鼠标轴缩放
    PinchRotate             尖顶岩
    PinchZoom               平齐变焦
    Pointer                 指针
    Select                  选择    //----------------------
    Snap                    捕捉
    Translate               翻译

颜色用rgba  #007db9cc打包会不识别透明

img和background显示图片区别 img右键可以另存  背景图片不能
        

geojson数据 ID 唯一 重复的不显示

官网Vector Labels示例 修改lable颜色线条样式

编码    936 (ANSI/OEM - Simplified Chinese GBK)

 

路的注记样式

new ol.style.Style({
                stroke: new ol.style.Stroke({//显示线条-----
                    color: 'blue',/* bug */
                    width: 2
                }),
                text: new ol.style.Text({
                        text: feature.get('name'),
                        textAlign: 'center', //对齐方式  
                        textBaseline: 'middle', //文本基线  
                        font: 'bold 14px "Open Sans", "Arial Unicode MS", "sans-serif"',
                        placement: 'line', //字的走向----
                        fill: new ol.style.Fill({ //填充样式  
                            color: '#663333'
                        }),
                }),
            });

放大缩小

            map.getView().setZoom(map.getView().getZoom()+1);
放大缩小平移
            var view = map.getView();  
            view.animate({  
                    center: [pointX,pointY],  
                    duration: 500 ,
            });   
            view.animate({  
                    zoom:5
            }); 

resolutions

78271.5169640203125‬     //1
中间值        ‭58,703.637723015234375‬
39135.75848201015625     //2
中间值        ‭29,351.8188615076171875‬
‭19567.879241005078125‬     //3
中间值        ‭14,675.90943075380859375‬
‭9783.9396205025390625‬     //4
中间值        ‭7,337.954715376904296875‬
‭4891.96981025126953125‬     //5
中间值        ‭3,668.9773576884521484375‬
‭2445.984905125634765625‬     //6
中间值        ‭1,834.48867884422607421875‬
‭1222.9924525628173828125  ‬ //7
中间值        ‭917.244339422113037109375‬
611.49622628140869140625     //8
中间值        ‭458.6221697110565185546875‬
305.748113140704345703125,//9
中间值        229.31108485552825927734375
152.8740565703521728515625,//10
中间值        114.655542427764129638671875
76.43702828517608642578125,//11
中间值        57.3277712138820648193359375
38.218514142588043212890625,//12
中间值        28.66388560694103240966796875
19.1092570712940216064453125,//13
中间值        14.331942803470516204833984375
9.55462853564701080322265625,//14
中间值        7.1659714017352581024169921875
4.777314267823505401611328125,//15
中间值        3.58298570086762905120849609375
2.3886571339117527008056640625,//16
中间值        1.791492850433814525604248046875
1.19432856695587635040283203125//17