ionic webApp 通过openlayer集成 arcgis 地图服务

<!--引入openlayer css-->

<link rel="stylesheet" href="lib/openlayer/css/ol.css">

<!--引入openlayer js-->

<script src="lib/openlayer/js/ol.js"></script>

//创建地图

var GISServiceUrl = GlobalVariable.GISServiceUrl;

var map =new ol.Map({ 

     target:'mapPage', 

     layers: [

        new ol.layer.Tile({      

        source:new ol.source.TileArcGISRest({        

            url: GISServiceUrl     

         })    

        }),    

        //featureOverlay8   ],

  view:new ol.View({    

    center: [

        112.3543, 37.5043],    

        zoom: 7,   

        minZoom: 6,    

        maxZoom: 20,    

        projection:'EPSG:4326'  

        })

        });

//Map 图层click事件绑定 弹框

var object ='';

 map.on('click',function (evt) { 

 //如果模态框已经打开，则不弹出，防止openlayer 多点触发问题（后面可看下openlayer是否有其他点击监听事件）   

    var pixel = map.getEventPixel(evt.originalEvent);  

    var feature = map.forEachFeatureAtPixel(pixel,function (feature) {    

            object = feature.values_.type;

            $scope.openDetail(object);

  });

});

for (var j = 0; j < mapDatas1.length; j++) {  

    var x1 = mapDatas1[j].lnglat[0], y1 = mapDatas1[j].lnglat[1],   obj1 = mapDatas1[j];   var createLabelStyle =function (feature) {    

        return new ol.style.Style({      

            image:new ol.style.Icon(        

            ({          

                anchor: [0.5, 60],          

                anchorOrigin:'top-right',          

                anchorXUnits:'fraction',          

                anchorYUnits:'pixels',          

                offsetOrigin:'top-right',          

                opacity: 0.75,          

                src: styleObjectArr[obj1.style].url        

            })      

            )   

        });  

    }//实例化Vector要素，通过矢量图层添加到地图容器中  

iconFeature1[j] =new ol.Feature({    

    geometry:new ol.geom.Point([x1, y1]),     type:obj1   });  

    iconFeature1[j].setStyle(createLabelStyle(iconFeature1[j]

    ));

}

//矢量标注的数据源

vectorSource1 =new ol.source.Vector({   features: iconFeature1 });

//矢量标注图层

vectorLayer1 =new ol.layer.Vector({   source: vectorSource1 });

//地图添加图层

map.addLayer(vectorLayer1);