我要
提问
智能客服
首页 / 浏览问题 / 云GIS / 问题详情
iclient js 不显示地图
techcave
91EXP 2017年03月30日
我用同样的代码，但是另外一个工作空间的地图地址，就不能正常显示，求指导。

2 个回答

您好！在代码中map.setCenter指定了地图的中心点位置，请在setCenter后面从新指定地图的中心点在另一个工作空间的范围中以保证正常显示。

还有您的前一个与后一个的地图服务都是Rest服务吗？如果后一个工作空间的不是rest服务的话需要改动的就比较多了，详情您可以参考示例代码中wmtsLayer.html，wms.html和wcs.html以解决问题。
程yan
1,695EXP 2017年03月30日

是发布的rest服务，重新指定了地图中心点，地图中心点的数据值是从isever例子的调试窗口中获得

techcave
91EXP 2017年03月30日
请问您可以把完整代码回复一下吗？我好帮您进一步分析。
程yan
1,695EXP 2017年03月31日

你好，下面是我的代码，如果使用第二个URL是正常的，最后一个不正常，我就测试这两个URL，我的代码如下：

<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script type="text/javascript" src="./assets/libs/sm/libs/SuperMap.Include.js"></script>
  <script type="text/javascript">
    <!--
    //声明变量map、layer、url
    var map, layer, layerImage, vectorLayer,
      url = ["http://localhost:8090/iserver/services/map-baidu/rest/maps/normal",
        "http://localhost:8090/iserver/services/map-reservoir2/rest/maps/lc@image",
        "http://localhost:8090/iserver/services/map-OSM/rest/maps/normal",
        "http://localhost:8090/iserver/services/map-reservoir2/rest/maps/WatchPoint@data",
		"http://localhost:8090/iserver/services/map-LinCangDiTu/rest/maps/Level17@testB2"
      ];
    //创建地图控件
    function init() {
      map = new SuperMap.Map("map", {
        controls: [
          new SuperMap.Control.ScaleLine(),
          //new SuperMap.Control.Zoom(),
          new SuperMap.Control.LayerSwitcher(),
          new SuperMap.Control.Navigation({ //添加导航控件到map
            dragPanOptions: {
              enableKinetic: true //拖拽动画
            }
          })
        ],
        allOverlays: true
      });
      //初始化复杂缩放控件类
      panzoombar = new SuperMap.Control.PanZoomBar();
      // 是否固定缩放级别为[0,16]之间的整数，默认为false
      panzoombar.forceFixedZoomLevel = true;
      //是否显示滑动条，默认值为false
      panzoombar.showSlider = true;
      /*点击箭头移动地图时，所移动的距离占总距离（上下移动的总距离为高度，左右移动的总距离为宽度）
      的百分比，默认为null。 例如：如果slideRatio 设为0.5, 则垂直上移地图半个地图高度.*/
      panzoombar.slideRatio = 0.5;
      //设置缩放条滑块的高度，默认为120
      panzoombar.sliderBarHeight = 180;
      //设置缩放条滑块的宽度，默认为13
      panzoombar.sliderBarWidth = 17;
      map.addControl(panzoombar);


      //创建分块动态REST图层，该图层显示iserver 8C 服务发布的地图,
      //其中"world"为图层名称，url图层的服务地址，{transparent: true}设置到url的可选参数
      layer = new SuperMap.Layer.TiledDynamicRESTLayer("地图", url[4], {
        cacheEnabled: true
      }, {
        maxResolution: "auto"
      });
      layer.events.on({
        "layerInitialized": addLayer
      });

      vectorLayer = new SuperMap.Layer.Vector("Vector Layer");

      // map.events.on({
      //   "click": callbackFunction
      // }); //添加click事件


      var callbacks = {
        click: onSelected
      };
      try {
      var selectFeature = new SuperMap.Control.SelectFeature(vectorLayer, {
        callbacks: callbacks
      });
      map.addControl(selectFeature);
      selectFeature.activate();
      } catch(ex) {
        console.log(ex);
      }

    }
    var infowin;

    function onSelected(currentFeature) {
      closeInfoWin();
      var popup = new SuperMap.Popup.FramedCloud("popwin",
        new SuperMap.LonLat(currentFeature.geometry.x, currentFeature.geometry.y),
        null,
        "名称：" + currentFeature.data.NAME + "<br><a href='#'>详细信息</a>",
        null,
        true);
      infowin = popup;
      map.addPopup(popup);
    }

    function closeInfoWin() {
      if (infowin) {
        try {
          infowin.hide();
          infowin.destroy();
        } catch (e) {}
      }
    }

    function callbackFunction(e) {
      //debugger;
      console.log(e);
      //alert("鼠标事件");

    }

    var inited = false;

    function addLayerImage() {
      map.addLayer(layerImage);
    }

    function addLayer() {
      //将Layer图层加载到Map对象上
      // map.addLayer(layer);
      map.addLayers([layer, vectorLayer]);
      getFeaturesBySQL();
      // layerImage = new SuperMap.Layer.TiledDynamicRESTLayer("监测点", url[3], {
      //   transparent: true,
      //   cacheEnabled: true
      // }, {
      //   maxResolution: "auto",
      //   maxExtend: new SuperMap.Bounds(-180, -90, 180, 90)
      // });
      // layerImage.events.on({
      //   "layerInitialized": addLayerImage
      // });

      //出图，map.setCenter函数显示地图
      try {
        //var lonLat1 = new SuperMap.LonLat(100.08831, 23.88535);
		var lonLat1 = new SuperMap.LonLat(11046444.664073, 2790516.8346258);
        console.log("lonLat1", lonLat1);
        //这里 lonLat1 = lonLat2
		/*
        var lonLat2 = lonLat1.transform(
          new SuperMap.Projection("EPSG:4326"),
          new SuperMap.Projection("EPSG:3857")
        );
        console.log("lonLat2", lonLat2);
        map.setCenter(lonLat2, 2);
		*/

		var defScale = 0.00016023557881126555;// 给客户端传递默认比例尺
		map.zoomToScale(defScale,true);
		map.zoomToScale(0.000015317172317776726, true);
        //map.panTo(new SuperMap.LonLat(100.104623,23.887861));
      } catch (ex) {
        console.log(ex);
      }
    }

    function getFeaturesBySQL() {
      vectorLayer.removeAllFeatures();

      var getFeatureParam, getFeatureBySQLService, getFeatureBySQLParams;

      getFeatureParam = new SuperMap.REST.FilterParameter({
        name: "Countries@World",
        attributeFilter: "SMID = 247"
      });
      var emptyQueryParam = new SuperMap.REST.FilterParameter({
        name: "WatchPoint@data"
      });
      getFeatureBySQLParams = new SuperMap.REST.GetFeaturesBySQLParameters({
        queryParameter: emptyQueryParam,
        datasetNames: ["data:WatchPoint"]
      });
      getFeatureBySQLService = new SuperMap.REST.GetFeaturesBySQLService(
        "http://localhost:8090/iserver/services/data-reservoir2/rest/data", {
          eventListeners: {
            "processCompleted": processCompleted,
            "processFailed": processFailed
          }
        });
      try {
        getFeatureBySQLService.processAsync(getFeatureBySQLParams);
        //getFeatureBySQLService.processAsync();
      } catch (ex) {
        console.log(ex);
      }
    }

    var style = {
      graphic: true,
      //externalGraphic: "assets/img/tx.png",
      graphicWidth: 35,
      graphicHeight: 35,
      // label: "supermap",
      // fontColor: "#0000ff",
      // fontOpacity: "0.5",
      // fontFamily: "隶书",
      // fontSize: "8em",
      // fontWeight: "bold",
      // fontStyle: "italic",
      // labelSelect: "true",
    };
    var styles = {
      "dam" :{graphic: true,
      externalGraphic: "assets/img/dam.png",
      graphicWidth: 35,
      graphicHeight: 35},
      "rain" :{graphic: true,
      externalGraphic: "assets/img/rain.png",
      graphicWidth: 35,
      graphicHeight: 35},
      "water" :{graphic: true,
      externalGraphic: "assets/img/water.png",
      graphicWidth: 35,
      graphicHeight: 35},
      "station" :{graphic: true,
      externalGraphic: "assets/img/station.png",
      graphicWidth: 35,
      graphicHeight: 35},
    };

    function processCompleted(getFeaturesEventArgs) {
      var i, len, features, feature, result = getFeaturesEventArgs.result;
      if (result && result.features) {
        features = result.features
        for (i = 0, len = features.length; i < len; i++) {
          var pStyle = new Object();
          feature = features[i];
          feature.style = styles[feature.data.TYPE];
          //feature.style.externalGraphic = ("assets/img/" + feature.data.TYPE + ".png"),
          vectorLayer.addFeatures(feature);
        }
      }
    }

    function processFailed(e) {
      alert(e.error.errorMsg);
    }
    //-->
  </script>
</head>

<body onload="init()">
  <div id="map" style="position:absolute;left:0px;right:0px;width:100%;height:100%;">
  </div>
</body>

</html>

techcave
91EXP 2017年03月31日
首先，如果您在iserver中无法预览您的工作空间地图的话说明您的工作空间出现了问题，您可以查看一下后台有没有其他进程占用了您的工作空间，比如iDesktop。

其次，您还需要去确定工作空间的坐标系单位，假设原工作空间坐标系单位为米，后一个为经纬度这样的情况也会导致中心点位置的不一样。

如果您还是有问题，请在下方继续留言。
程yan
1,695EXP 2017年03月31日
我现在有两个URL，对应数组里面的的索引是1和4。

1、1是正常显示，4用我的代码不显示；

2、4在iserver里面javascript是可以预览的；

3、中心点坐标我用的是iserver预览里面的。
techcave
91EXP 2017年03月31日
你好，地图不能显示首先检查另一个工作空间发布出来的服务有没有问题，如果在iServer的页面上能预览到地图说明服务正常。然后检查url以及中心点是否设置正确。一般来说修改了服务地址之后需要修改地图的中心点，中心点可以从地图服务的页面上获取。
袁子翔
5EXP 2017年03月30日
iserver上可以显示，我打开调试获取了iserver使用的中心点。
techcave
91EXP 2017年03月30日

智能推荐

热门文章
查看更多>
关注我们
超图软件官网 SuperMap Online 地图慧 帮助中心 备案信息 技术资源中心
...