在地图上根据经纬度展示对应点位,及自定义自定义图标的实现ArcGIS

1:html

// THML 页面显示
 <div class="one-middle-top">
     <!-- 地图 -->
      <div style="width:100%;height:100%;" id="dituContent">
 </div>

#2:基于4.17 版本

// 基于4.17 版本 样式及JS引入
<link  rel="stylesheet"  href="https://js.arcgis.com/4.17/esri/themes/light/main.css"/>
<script src="https://js.arcgis.com/4.17/"></script>

#3:JS

// 插件参数配置
require([
        "esri/Map",
        "esri/views/SceneView",
        "esri/symbols/PictureMarkerSymbol",
        "esri/geometry/Point",
        "esri/Graphic",
        "esri/layers/GraphicsLayer"
      ], function(Map, SceneView,PictureMarkerSymbol,Point,Graphic,GraphicsLayer) {
        var map = new Map({
          basemap: "gray"
        });
        var view = new SceneView({
          container: "viewDiv",
          map: map,
          zoom: 12,
          center: [0, 0]
        });
        var gLayer = new GraphicsLayer();
        map.add(gLayer);
        var symbol = {
          type: "picture-marker",
          url: ctxPath+"/js/map/bigScreen/images/tubiao/ycy.png",//自定义图片地址
          width: "22px",
          height: "28px"
        };
        var point = new Point(0,0);
        var gp = new Graphic(point,symbol);
        gLayer.graphics.add(gp);//添加到地图图层中显示
      });

#4:效果展示
在这里插入图片描述

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Java000I

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值