POST
|
Hello, We are trying to display a layer on a map using a LayerList Widget via the 3.25 version of the API. We have been able to successfully display the layer itself in the widget and on the map but are having trouble with being able to show labels for the layer. We see in the list of fields that the field name "PIN" exists but all our efforts to get the labels to display are coming up short. Our code is below. Any help will be much appreciated. <!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>Parcel Details</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.25/dijit/themes/claro/claro.css">
<link rel="stylesheet" href="https://js.arcgis.com/3.25/esri/css/esri.css">
<style>
html, body, .container, #map {
height:100%;
width:100%;
margin:0;
padding:0;
margin:0;
font-family: "Open Sans";
}
#map {
padding:0;
}
#layerListPane{
width:25%;
}
.esriLayer{
background-color: #fff;
}
.esriLayerList .esriList{
border-top:none;
}
.esriLayerList .esriTitle {
background-color: #fff;
border-bottom:none;
}
.esriLayerList .esriList ul{
background-color: #fff;
}
</style>
<script>var dojoConfig = { parseOnLoad: true };</script>
<script src="https://js.arcgis.com/3.25/"></script>
<script>
require([
"esri/map",
"esri/layers/ArcGISDynamicMapServiceLayer",
"esri/dijit/LayerList",
"esri/urlUtils",
"esri/layers/LabelClass",
"esri/layers/LayerDrawingOptions",
"esri/symbols/TextSymbol",
"dojo/domReady!"
], function (
Map,
ArcGISDynamicMapServiceLayer,
LayerList,
urlUtils,
LabelClass,
LayerDrawingOptions,
TextSymbol
) {
urlUtils.addProxyRule({
urlPrefix: "www.gis.bocc.co.st-johns.fl.us",
proxyUrl: "<The URL to our ESRI Proxy Server comes here>"
});
//Create a map based on an ArcGIS Online web map id
var map = new Map("map", {
basemap: "topo",
center: [-81.312431, 29.901243], // long, lat
zoom: 17,
sliderStyle: "small",
showLabels : true
});
map.on("load", function(){
var point = new esri.geometry.Point({ 'x': -81.312431, 'y': 29.901243, 'spatialReference': { 'wkid': 4326 } });
var infoSymbol =
new esri.symbol.PictureMarkerSymbol({
'angle':0,
'xoffset':0,
'yoffset':12,
'type':'esriPMS',
'url':'https://static.arcgis.com/images/Symbols/Basic/YellowStickpin.png',
'contentType':'image/png',
'width':24,
'height':24});
map.graphics.add(new esri.Graphic(point,infoSymbol));
});
var stJohnsCountyParcelLayer = new ArcGISDynamicMapServiceLayer("http://www.gis.bocc.co.st-johns.fl.us/sjcgis/rest/services/Parcel/MapServer", {
"id": "stJohnsCountyParcelLayer",
"showAttribution": false,
"showLabels": true
});
// =========================
var optionsArray = [];
var drawingOptions = new LayerDrawingOptions();
var labelClass = new LabelClass({
labelExpression: '[' + "PIN" + ']',
labelPlacement: 'esriServerPolygonPlacementAlwaysHorizontal',
symbol: new TextSymbol()
});
drawingOptions.labelingInfo = [labelClass];
drawingOptions.showLabels = true;
optionsArray[0] = drawingOptions;
stJohnsCountyParcelLayer.setLayerDrawingOptions(optionsArray);
stJohnsCountyParcelLayer.show();
// ==================================================
map.addLayer(stJohnsCountyParcelLayer);
var myWidget = new LayerList({
map: map,
layers: [{
layer: stJohnsCountyParcelLayer,
id: "St. Johns County Parcels",
showSubLayers: true
}]
}, "layerList");
});
</script>
</head>
<body class="claro">
<div class="container" data-dojo-type="dijit/layout/BorderContainer"
data-dojo-props="design:'headline',gutters:false">
<div id="layerListPane" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'right'">
<div id="layerList"></div>
</div>
<div id="map" data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'"></div>
</div>
</body>
</html> Thanks.
... View more
01-26-2020
06:22 AM
|
0
|
0
|
515
|
POST
|
Ben, Thank you for your answer. I tried setting httpsDomains to an empty array. Unfortunately, the request to my domain still went out as https (and not http). I then tried using interceptors to intercept and rewrite the url from https to http. This got me further - and I was able to get to the root of the issue. The issue is that "Mixed Content" is not allowed on the page when the page itself has been loaded over HTTPS. I believe this is why the ArcGIS JavaScript API is not taking into effect the httpsDomains property being set to an empty array. Thanks for your help though. At this point we are considering using a HTTPS Proxy to get to the HTTP based endpoint.
... View more
01-22-2020
03:45 PM
|
0
|
0
|
514
|
POST
|
MapImageLayer converts an http url to https which prevents the layer from correctly loading. The endpoint is not HTTPS enabled, and the automatic conversion from http to https is preventing the layer from loading. Can someone please help? Thanks in advance. <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
<title>MapImageLayer - create dynamic map layers - 4.14</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.14/esri/themes/light/main.css" />
<script src="https://js.arcgis.com/4.14/"></script>
<style>
html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; }
</style>
<script>
require([
"esri/Map", "esri/views/SceneView", "esri/layers/MapImageLayer",
], function(Map, SceneView, MapImageLayer) {
var layer = new MapImageLayer({
title: "Parcels",
sublayers: [{
id: 0
}]
});
layer.url = "http://www.gis.bocc.co.st-johns.fl.us/sjcgis/rest/services/Parcel/MapServer";
var map = new Map({
basemap: "topo", layers: [layer]
});
var view = new SceneView({
container: "viewDiv", map: map, zoom: 13, center: [-81.6314837, 30.356906]
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
... View more
01-22-2020
01:43 PM
|
0
|
2
|
577
|
Online Status |
Offline
|
Date Last Visited |
11-11-2020
02:24 AM
|