Using javascript api 3.10 (tried 3.9 also). Everything works on desktop. but i cant seem to Move a point in the editor widget.
I had this working, and I am not sure if an iOS update broke it or what. Its impossible to debug on ipads.
So I select a point by tapping it. It selects fine. If i try to drag it, the map pans. IF i tap hold, i get a magnifying window.
So i
fLayer.on("selection-complete", lang.hitch(this, function(graphics){
// alert('selection-complete');
// console.dir(graphics);
if(fLayer.getSelectedFeatures().length>0){
if(has('touch')){
// alert('selection complete');
map.disableMapNavigation();
// alert('nav disabled');
}
registry.byId("EditContainer").selectChild(registry.byId("editAttributePane"));
fLayer.redraw();
}else{
if(has('touch')){
map.enableMapNavigation();
// alert('nav enabled');
}
registry.byId("EditContainer").selectChild(registry.byId("editToolPane"));
}
}));
To disable mapnav on touch if a point is selected.
But if i try to move it, nothing happens.
anybody?
I dont see an attachment.
It looks like any hooking into the tap event, or disabling mapnav (to prevent panning) seems to break it. I will try and post a sample
Hey Jeff,
Just double checking that you don't see an attachment in my previous post (editor_mobile.html.zip ).
If not, looks like a bug with GeoNet.
Code below:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<title>Default Editor</title>
<link rel="stylesheet" href="http://js.arcgis.com/3.10/js/dojo/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="http://js.arcgis.com/3.10/js/esri/css/esri.css">
<style>
html, body {
height: 100%;
width: 100%;
margin: 0;
}
body {
background-color: #fff;
overflow: hidden;
font-family: Helvetica, san-serif;
}
#templatePickerPane {
width: 225px;
overflow: hidden;
}
#panelHeader {
background-color: #92A661;
border-bottom: solid 1px #92A860;
color: #FFF;
font-size: 12px;
height: 14px;
line-height: 12px;
margin: 0;
overflow: hidden;
padding: 10px 10px 10px 10px;
}
#map {
margin-right: 5px;
padding: 0;
}
.esriEditor .templatePicker {
padding-bottom: 5px;
padding-top: 5px;
height: 500px;
border-radius: 0px 0px 4px 4px;
border: solid 1px #92A661;
}
</style>
<script src="http://js.arcgis.com/3.10/"></script>
<script>
var map, editorWidget;
require([
"esri/config",
"esri/map",
"esri/SnappingManager",
"esri/dijit/editing/Editor",
"esri/layers/FeatureLayer",
"dojo/has",
"dojo/dom-construct",
"dojo/keys",
"dojo/on",
"dojo/parser",
"dojo/_base/array",
"dojo/i18n!esri/nls/jsapi",
"dijit/layout/BorderContainer",
"dijit/layout/ContentPane",
"dojo/domReady!"
], function (
esriConfig, Map, SnappingManager, Editor, FeatureLayer,
has, domConstruct, keys, on, parser, arrayUtils, i18n
) {
alert(has("touch"));
console.log(has("touch"));
parser.parse();
map = new Map("map", {
basemap: "topo",
center: [-117.198, 34.049],
zoom: 14
});
map.on("layers-add-result", initEditing);
var fLayer = new FeatureLayer("http://sampleserver5.arcgisonline.com/ArcGIS/rest/services/Energy/HSEC/FeatureServer/0", {
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["*"]
});
fLayer.on("selection-complete", function(graphics){
if(fLayer.getSelectedFeatures().length>0){
if(has('touch')){
map.disableMapNavigation();
}
fLayer.redraw();
}else{
if(has('touch')){
map.enableMapNavigation();
}
}
});
map.addLayers([fLayer]);
map.infoWindow.resize(400, 300);
function initEditing (event) {
if(editorWidget){
editorWidget.destroy();
}
var featureLayerInfos = arrayUtils.map(event.layers, function (layer) {
return {"featureLayer": layer.layer};
});
var settings = {"map" : map, "layerInfos" : featureLayerInfos};
var params = {"settings": settings};
editorWidget = new Editor(params, "editorDiv");
var options = {"snapKey": keys.copyKey};
map.enableSnapping(options);
editorWidget.startup();
}
});
</script>
</head>
<body class="claro">
<div id="mainWindow" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline',gutters:false" style="width:100%; height:100%;">
<div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">
</div>
<div data-dojo-type="dijit/layout/ContentPane" id="templatePickerPane" data-dojo-props="region:'bottom'" style="height:20%">
<div id="panelHeader">
Default Editor
</div>
<div style="padding:10px;" id="editorDiv">
</div>
</div>
</div>
</body>
</html>