Is this a bug in v4.8? I am unable to render a halo/mask around a text symbol using v4.8 of the JSAPI (in Chrome, IE, and FF). Here's the jsbin - JS Bin - Halo
...and the code demonstrating the issue
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Halo</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.8/esri/css/main.css">
<script src="https://js.arcgis.com/4.8/"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/Graphic",
"esri/geometry/Point",
"dojo/domReady!"
], function(
Map,
MapView,
Graphic,
Point
) {
var map = new Map({
basemap: "gray"
});
var view = new MapView({
center: [-82.4572, 27.9506],
container: "viewDiv",
map: map,
zoom: 12
});
var point = new Point({
longitude: -82.4572,
latitude: 27.9506
});
var textSymbol = {
type: "text",
color: "#000000",
haloColor: "#008000",
haloSize: "6px",
text: "HELLO",
xoffset: -12,
yoffset: 2,
font: {
size: 12,
family: "calibri",
weight: "bold"
}
};
var pointGraphic = new Graphic({
geometry: point,
symbol: textSymbol
});
view.graphics.add(pointGraphic);
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
This should work per the documentation - TextSymbol | API Reference | ArcGIS API for JavaScript 4.8
