Brad Cooper
<html>
<head>
<meta charset="utf-8" />
<meta
name="viewport"
content="initial-scale=1,maximum-scale=1,user-scalable=no"
/>
<title>
Floating polygon to see about only doing outline and not fill
</title>
<link
rel="stylesheet"
href="https://js.arcgis.com/4.16/esri/themes/light/main.css"
/>
<script src="https://js.arcgis.com/4.16/"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
"esri/Map",
"esri/views/SceneView",
"esri/layers/GraphicsLayer",
"esri/Graphic"
], function (Map, SceneView, GraphicsLayer, Graphic) {
var map = new Map({
basemap: "hybrid"
});
var view = new SceneView({
container: "viewDiv",
map: map,
camera: {
position: {
x: -0.17746710975334712,
y: 51.44543992422466,
z: 1266.7049653716385
},
heading: 0.34445102566290225,
tilt: 82.95536300536367
}
});
var graphicsLayer = new GraphicsLayer();
map.add(graphicsLayer);
var polygon = {
type: "polygon",
rings: [
[-0.184, 51.48391],
[-0.184, 51.49091],
[-0.172, 51.49091],
[-0.172, 51.48391],
[-0.184, 51.48391]
]
};
var threeDfillSymbol2 = {
type: "polygon-3d",
symbolLayers: [
{
type: "extrude",
size: 800,
material: {
color: [67, 145, 244, 0.5]
},
edges: {
type: "solid",
color: "#AF6515"
}
}
]};
var polygonGraphic = new Graphic({
geometry: polygon,
symbol: threeDfillSymbol2
});
graphicsLayer.add(polygonGraphic);
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>