React Native for Arcgis 地图开发 SketchEditorCtrl（十七）

于 2022-11-14 15:38:22 发布
阅读量102 收藏
点赞数
文章标签： arcgis react native react.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/haibalai2009/article/details/127848772
版权

SketchEditorCtrl 图形编辑封装

import React, {useState, useEffect} from 'react';
import {View, Text, ScrollView, StyleSheet, DeviceEventEmitter} from 'react-native';
import {Button, List, Switch} from '@ant-design/react-native';
import {SketchEditorCtrl, LayerManager, MapManager, MapView, SketchCreationMode} from '@haibalai/react-native-arcgis';
import {connect} from 'react-redux';
import WidthDrawer from '../../../../components/WithDrawer/index';
import {Colors} from 'react-native/Libraries/NewAppScreen';
import {StackActions} from 'react-navigation';
import {SketchEventType} from '../../../../../nativeModules/core/SketchEventType';
const MapId = 'baseMap';
const GraphicLayerId = 'graphic点';
const MapImageLayerId = '水闸-MapImageLayer';
const FeatureLayerId = '水闸-featurelayer';
const MapImageLayerIds = [
'水闸-MapImageLayer',
'原水管线-MapImageLayer',
'海堤-MapImageLayer',
'海洋环境区划-MapImageLayer',
];
const FeatureLayerIds = [
'水闸-featurelayer',
'原水管线-featurelayer',
'原水管线-featurelayer',
'海洋环境区划-featurelayer',
];
const GraphicLayerIds = ['graphic点', 'graphic线', 'graphic面'];
const GeoX = 1.2664272368526626e7;
const GeoY = 2595847.2157473154;
const Geo4490X = 113.78868474700005;
const Geo4490Y = 22.693641836999973;
const strSketchCreationMode = SketchCreationMode.POLYLINE;
const strEditConfiguration = null;
const partIndex = 0;
const pointIndex = 1;
const insertionIndex = 1;
const point = '';
const visible = true;
const geometry = '';
const sketchEventType = SketchEventType.onGeometryChanged;
let listenerId = '';
const strFeedBackPointSymbol = {
angle: 0,
color: [255, 0, 0, 255],
size: 7.5,
style: 'esriSMSCircle',
type: 'esriSMS',
xoffset: 0,
yoffset: 0,
};
const strFeedbackLineSymbol = {color: [0, 0, 128, 255], style: 'esriSLSDash', type: 'esriSLS', width: 0.75};
const strFeedbackVertexSymbol = {
color: [0, 80, 0, 255],
outline: {color: [0, 0, 128, 255], style: 'esriSLSDash', type: 'esriSLS', width: 0.75},
style: 'esriSFSDiagonalCross',
type: 'esriSFS',
};
const opacity = 0.5;
const strFillSymbol = {
color: [0, 80, 0, 255],
outline: {color: [0, 0, 128, 255], style: 'esriSLSDash', type: 'esriSLS', width: 0.75},
style: 'esriSFSDiagonalCross',
type: 'esriSFS',
};
const strLineSymbol = {color: [0, 0, 128, 255], style: 'esriSLSDash', type: 'esriSLS', width: 0.75};
const strFeedbackFillSymbol = {
color: [0, 80, 0, 255],
outline: {color: [0, 0, 128, 255], style: 'esriSLSDash', type: 'esriSLS', width: 0.75},
style: 'esriSFSDiagonalCross',
type: 'esriSFS',
};
const strMidVertexSymbol = {
angle: 0,
color: [0, 255, 0, 255],
size: 7.5,
style: 'esriSMSCircle',
type: 'esriSMS',
xoffset: 0,
yoffset: 0,
};
const strSelectedVertexSymbol = {
angle: 0,
color: [0, 0, 255, 255],
size: 7.5,
style: 'esriSMSCircle',
type: 'esriSMS',
xoffset: 0,
yoffset: 0,
};
const strMultilayerVertexSymbol = '';
const strSelectedMidVertexSymbol = {
angle: 0,
color: [255, 255, 0, 255],
size: 7.5,
style: 'esriSMSCircle',
type: 'esriSMS',
xoffset: 0,
yoffset: 0,
};
const strVertexSymbol = {
angle: 0,
color: [0, 255, 255, 255],
size: 7.5,
style: 'esriSMSCircle',
type: 'esriSMS',
xoffset: 0,
yoffset: 0,
};
const strVertexTextSymbol = {
angle: 0,
backgroundColor: [0, 0, 0, 0],
borderLineColor: [0, 0, 0, 0],
borderLineSize: 0,
color: [0, 0, 230, 255],
font: {decoration: 'none', size: 7.5, style: 'normal', weight: 'normal'},
haloColor: [0, 0, 0, 0],
haloSize: 0,
horizontalAlignment: 'right',
kerning: false,
text: '文本',
type: 'esriTS',
verticalAlignment: 'top',
xoffset: 0,
yoffset: 0,
};
const showNumbersForVertices = true;
let tmpLocateListener: any = null;
/** sideBar组件
*

@param {*} renderCb renderCb是一个函数, 每次触发并且向里面传值(对象)，content组件就以sideBarData的属性去接受
*/
const SideBar = ({renderCb, Home}: any) => {
const [content, changeContent] = useState('');
const [errorContent, changeErrorContent] = useState('');
const [singleMapImageLayerStatus, setSingleMapImageLayerStatus] = useState(false);
const [multiMapImageLayerStatus, setMultiMapImageLayerStatus] = useState(false);
const [singleFeatureLayerStatus, setSingleFeatureStatus] = useState(false);
const [multiFeatureLayerStatus, setMultiFeatureLayerStatus] = useState(false);
const [singleGraphicLayerStatus, setSingleGraphicLayerStatus] = useState(false);
const [multiGraphicLayerStatus, setMultiGraphicLayerStatus] = useState(false);
useEffect(() => {
renderCb({content, errorContent});
}, [content, errorContent, renderCb]);
const getGeoX = () => {
let coordinate = Home.coordinate;
if (coordinate === '4490') {
return Geo4490X;
} else {
return GeoX;
}
};
const getGeoY = () => {
let coordinate = Home.coordinate;
if (coordinate === '4490') {
return Geo4490Y;
} else {
return GeoY;
}
};
const onSwitchSingleMapImageLayer = (e: boolean) => {
if (e) {
LayerManager.showLayer(MapId, MapImageLayerId);
} else {
LayerManager.hideLayer(MapId, MapImageLayerId);
}
setSingleMapImageLayerStatus(e);
};
const onSwitchMultiMapImageLayer = (e: boolean) => {
if (e) {
LayerManager.showLayers(MapId, MapImageLayerIds);
} else {
LayerManager.hideLayers(MapId, MapImageLayerIds);
}
setMultiMapImageLayerStatus(e);
};
const onSwitchSingleFeatureLayer = (e: boolean) => {
if (e) {
LayerManager.showLayer(MapId, FeatureLayerId);
} else {
LayerManager.hideLayer(MapId, FeatureLayerId);
}
setSingleFeatureStatus(e);
};
const onSwitchMultiFeatureLayer = (e: boolean) => {
if (e) {
LayerManager.showLayers(MapId, FeatureLayerIds);
} else {
LayerManager.hideLayers(MapId, FeatureLayerIds);
}
setMultiFeatureLayerStatus(e);
};
const onSwitchSingleGraphicLayer = (e: boolean) => {
setSingleGraphicLayerStatus(e);
//加载单个图层的graphics
};
const onSwitchMultiGraphicLayer = (e: boolean) => {
setMultiGraphicLayerStatus(e);
//加载多个图层的graphics
};
const onInit = () => {
SketchEditorCtrl.init(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onRemove = () => {
SketchEditorCtrl.remove(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStartByCreationMode1 = () => {
SketchEditorCtrl.startByCreationMode(MapId, SketchCreationMode.POINT, strEditConfiguration)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStartByCreationMode2 = () => {
SketchEditorCtrl.startByCreationMode(MapId, SketchCreationMode.POLYLINE, strEditConfiguration)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStartByCreationMode3 = () => {
SketchEditorCtrl.startByCreationMode(MapId, SketchCreationMode.POLYGON, strEditConfiguration)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStartByCreationMode4 = () => {
SketchEditorCtrl.startByCreationMode(MapId, SketchCreationMode.MULTIPOINT, strEditConfiguration)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStartByCreationMode5 = () => {
SketchEditorCtrl.startByCreationMode(MapId, SketchCreationMode.FREEHAND_LINE, strEditConfiguration)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStartByCreationMode6 = () => {
SketchEditorCtrl.startByCreationMode(MapId, SketchCreationMode.FREEHAND_POLYGON, strEditConfiguration)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStartByGeometry = () => {
SketchEditorCtrl.startByGeometry(MapId, geometry, strSketchCreationMode, strEditConfiguration)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onStop = () => {
SketchEditorCtrl.stop(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);

})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onRedo = () => {
SketchEditorCtrl.redo(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onUndo = () => {
SketchEditorCtrl.undo(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onCanRedo = () => {
SketchEditorCtrl.canRedo(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onCanUndo = () => {
SketchEditorCtrl.canUndo(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onClearGeometry = () => {
SketchEditorCtrl.clearGeometry(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetGeometry = () => {
SketchEditorCtrl.getGeometry(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetOpacity = () => {
SketchEditorCtrl.getOpacity(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetSelectedVertex = () => {
SketchEditorCtrl.getSelectedVertex(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onSetSelectedVertex = () => {
SketchEditorCtrl.setSelectedVertex(MapId, partIndex, pointIndex)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onSetSelectedMidVertex = () => {
SketchEditorCtrl.setSelectedMidVertex(MapId, partIndex, insertionIndex)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onInsertVertexAfterSelectedVertex = () => {
SketchEditorCtrl.insertVertexAfterSelectedVertex(MapId, point)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onIsSketchValid = () => {
SketchEditorCtrl.isSketchValid(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onIsVisible = () => {
SketchEditorCtrl.isVisible(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onSetVisible = () => {
SketchEditorCtrl.setVisible(MapId, visible)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onMoveSelectedVertex = () => {
SketchEditorCtrl.moveSelectedVertex(MapId, point)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onRemoveSelectedVertex = () => {
SketchEditorCtrl.removeSelectedVertex(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onReplaceGeometry = () => {
SketchEditorCtrl.replaceGeometry(MapId, geometry)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onAddListener = () => {
SketchEditorCtrl.addListener(MapId, sketchEventType)
.then((r: any) => {
changeErrorContent('');
tmpLocateListener = DeviceEventEmitter.addListener(sketchEventType, r => {
listenerId = r;
changeContent(r);
});
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onRemoveListener = () => {
SketchEditorCtrl.removeListener(MapId, listenerId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onClearListener = () => {
SketchEditorCtrl.clearListener(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetFeedbackFillSymbol = () => {
SketchEditorCtrl.getFeedbackFillSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetFeedbackLineSymbol = () => {
SketchEditorCtrl.getFeedbackLineSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetFeedbackVertexSymbol = () => {
SketchEditorCtrl.getFeedbackVertexSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetFillSymbol = () => {
SketchEditorCtrl.getFillSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetLineSymbol = () => {
SketchEditorCtrl.getLineSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMidVertexSymbol = () => {
SketchEditorCtrl.getMidVertexSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerFeedbackFillSymbol = () => {
SketchEditorCtrl.getMultilayerFeedbackFillSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerFeedbackLineSymbol = () => {
SketchEditorCtrl.getMultilayerFeedbackFillSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerFeedbackVertexSymbol = () => {
SketchEditorCtrl.getMultilayerFeedbackVertexSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerFillSymbol = () => {
SketchEditorCtrl.getMultilayerFillSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerLineSymbol = () => {
SketchEditorCtrl.getMultilayerLineSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerMidVertexSymbol = () => {
SketchEditorCtrl.getMultilayerMidVertexSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerSelectedMidVertexSymbol = () => {
SketchEditorCtrl.getMultilayerSelectedMidVertexSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetMultilayerSelectedVertexSymbol = () => {
SketchEditorCtrl.getMultilayerSelectedVertexSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
const onGetVertexSymbol = () => {
SketchEditorCtrl.getVertexSymbol(MapId)
.then((r: any) => {
changeErrorContent('');
changeContent(r);
})
.catch((e: any) => {
changeErrorContent(e);
});
};
haibalai2009
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【番外】 React中使用ArcGIS JS API 4.14开发
X北辰北的博客
01-16 2907
一、概述 在之前很长的一段时间中，使用ArcGIS JS API(以下简称“JS API”)开发WebGIS系统的时候，还是基于传统的前端框架和各种前端技术来开发，这些框架和技术各位使用过的大概有这些：Dojo、jQuery、Bootstrap、CommonJS等。用这些传统的技术框架结合JS API去开发的时候，我们引入JS API是在系统的HTML页面中通过<script>和&l...
GIS教程之 在 React 中创建 Openlayers 地图（教程含源码）
iCloudEnd的博客
10-26 1098
信不信由你！没有可用的主动包可以利用 Openlayers 的功能和 react 的组件。（我们无论如何都在建造它🤫）。在这篇博客中，我将向您展示创建 openlayers 应用程序的更快方法。我们将为此使用以下技术。
ArcGIS API for JavaScript 结合React（一）在地图上添加点图层并加点击事件
叁喵的博客
10-18 2945
前言： 1.地理坐标WKID=4326，对应的名称是GCS_WGS_1984，即World Geodetic System 1984，是为GPS全球定位系统使用而建立的坐标系统，也是全球所有卫星所用的坐标系统，主要参数是地球经纬度。 BingMap和GoogleMao坐标系都是用的这个坐标系。 2.有图层的概念，第一图层是地图的绘制，如果想要绘制点或者其他几何图层，需要新增一个图层，如果在...
react + arcgis项目创建
lingliu0824的博客
01-23 1294
1.创建react项目：（这里使用了typescript,如果不需要则去掉–template typescript）： create-react-app projectname --template typescript 2.安装@esri/react-arcgis npm install @esri/react-arcgis 3.安装esri-loader npm install esri-loader 4.demo: import React, { Component } from 'react'
ArcGIS for Android中SketchEditor类的样式修改问题
foryond的专栏
08-16 652
近期在使用ArcGIS for Android的SDK进行移动端App开发，相信好多人在开发过程中都会遇到手绘点、线、面和距离、面积测量等常见GIS需求，对于ArcGIS for Android来说使用SketchEditor类会大大减少开发代码工作量，而且是官方的类和接口，稳定性也非常棒，参考Sample足以实现相关功能，官方Sample链接：https://developers.arcgis.com/android/latest/java/sample-code/sketch-edito...
react 之 openlayer地图图片下载
gis_sss的博客
05-29 720
一、原理 地图渲染是通过canvas来渲染出来的，openlayers提供的map.once('postcompose', function (event) {}）函数可以获取canvas对象，将canvas转化成图片下载下来，便可实现。 二、引入所依赖的文件 import React, { Component } from 'react'; import Map from '../../...
react项目arcgis地图初始化以及点聚合按实体状态分类实现
infinovachenm的博客
09-04 785
arcgis地图初始化以及点聚合按实体状态分类实现准备工作nginx代理配置api文件开始初始化实现点聚合展示点聚合文件实现不同状态下的点聚合 准备工作 首先，要初始化arcgis地图就需要地图api和地图服务，地图api大家可以去我的gitee下载:arcgisapi_3.2（开源的） 下载后是这样的，如图所示: 可以发现，里面既有api文档，也有其他文件，ConfigTool.exe我们后面会用到，另外两个markdown不用管。 地图服务推荐网址：点击前往 点进去自己选一个就行 nginx代理 为什
arcgis结合react + ts 的demo，点，线，面，图例，谷歌地图，高德地图，搜索定位点
泛酸的桂花酒
10-18 1500
文章目录前言一、什么是arcgis二、使用步骤1.创建react 项目 引入arcgis2.创建地图创建点的方法创建线创建图例总结 下面的代码地址 前言 前段时间看到 arcgis api 更新 4.2x 版本，而且全面拥抱 ES Modules 开发模式，相对于之前的模式对于前端开发ersi的方式，更具代码可读性，省去了一些麻烦，es modules出来有一段时间了，我们可以入手去尝试。； 一、什么是arcgis ArcGIS API for JavaScript 可以构建引人注目的 Web 应用
ArcGIS for Android视频教程
08-26
移动GIS开发，ArcGIS Runntime SDK for Android学习教程，基于新版SDK(100.X)的api讲解,快速开发移动GIS应用。
arcgis runtime for android 100.13.0 入门系列，二、使用SketchEditor工具类绘制图形geometry，初步使用符号化和标注表达式
weixin_40807433的博客
04-02 4859
上一篇我们已经初步的搭建起arcgis-android:100.13.0了，这一篇我们来研究如何在arcgis中绘制点，线，面图形来获得geometry对象，以方便我们后续篇章来将geometry对象存储另存为kml，shp，geojson，也或者是存储在arcgis server服务端。 在开始前我稍微改造了一下上一篇章的程序，我将默认各位会编写任意安卓布局，这一点我将忽略讲述 言归正传、要绘制点，线，面，要素图形我们需要用到arcgis提供的SketchEditor工具类，用它即可快速完成绘制。
ReactNative移动开发工具-其他
06-29
ReactNative可以基于目前大热的开源JavaScript库React.js来开发iOS和Android原生App。而且React Native已经用于生产环境——Facebook Groups iOS应用就是基于它开发的。 React Native的原理是在JavaScript中用React...
ReactNative移动开发工具 v0.71.7
07-01
ReactNative可以基于目前大热的开源JavaScript库React.js来开发iOS和Android原生App。而且React Native已经用于生产环境——Facebook Groups iOS应用就是基于它开发的。 React Native的原理是在JavaScript中用React...
React Native for iOS Development
09-04
React has become a leading technology for building fast, responsive native iOS apps. You will begin by understanding the path breaking concepts of React, which makes it distinctive. React is a ...
从Samurai-Native框架开发谈ReactNative
02-20
近一年移动开发领域最火的话题就是“Web与Native正在融合”，ReactNative的出现是推动融合的一个关键点。正如F8大会的主题“Bringmodernwebtechtomobile”，巨头们已经着手从上自下展开技术融合，WebApp开发者们与...
东方耀手把手教React Native实战开发
02-15
第1课1、手把手教React Native实战之环境搭建【Mac真机】同时调试开发Android&IOS; 第2课2、手把手教React Native实战之从React到RN 第3课3、手把手教React Native实战之flexbox布局(RN基础) 第4讲4、手把手教React ...
空间要素绘制 - ArcGIS Runtime SDK for Android（Version 100.1.0）
abigflower的博客
09-23 1206
创建 – 矩形、点 Envelope envelope = new Envelope(-123.0, 33.5, -101.0, 48.0, SpatialReferences.getWgs84()); Point pt = new Point(34.056295, -117.195800, SpatialReferences.getWgs84()); PointCollection s
ArcGIS Runtime100.1.0 - 草图绘制
SevenJohs的博客
11-08 1878
草图绘制在地图上进行涂鸦操作之后保存图形数据。
React Native for Arcgis 地图开发 图层配置 （二）
haibalai2009的博客
03-02 273
针对图层配置 VectorTiledLayer { “LayerId”: “矢量切片”, “LayerType”: “VectorTiledLayer”, “ServerAddr”: “https://basemaps.arcgis.com/arcgis/rest/services/World_Basemap_v2/VectorTileServer”, “DefineInfo”: { “Opacity”: 0.5, “Priority”: 5, “SubPriority”: 15, “QueryFlag”:
arcgis api（一）react 或vue项目 结合 arcgis api for js 地图
zhengjie0722的博客
07-31 4284
传统的arcgis api for js 的开发包是用require.js引用开发包的各个模块，然后再实例化对象。随着前端技术的发展，react.js、vue.js、es6的普及，模块化开发越来越多。也有很多跟arcgis相关的组件应运而生，比如react的react-arcgis组件，包含了arcgis api的部分功能，但是其并没有包含arcgis api 的所有功能，很多功能还是需要在...
react native开发指南
最新发布
09-07
React Native是一种流行的跨平台移动应用开发框架，它可以让开发者使用React的语法和组件开发iOS和Android应用。以下是关于React Native开发指南的一些要点： 首先，需要掌握JavaScript和React的基础知识，因为...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值