I am attempting to add a TextSymbol to a map in Web AppBuilder; however, the text does not display on the map. When I inspect the <div> created for the text graphics layer, is shows 0 x 0. Additionally, when I inspect the this._textLayer in Chrome, it does not have anything listed under its graphics attribute.
define(['dojo/_base/declare',
'dijit/_WidgetsInTemplateMixin',
'esri/graphic',
'esri/Color',
'esri/geometry/Point',
'esri/layers/GraphicsLayer',
'esri.symbols/TextSymbol',
'esri/symbols/Font'
],
function(declare, _WidgetInTemplateMixin, Graphic, Color, Point,
GraphicsLayer, TextSymbol, Font) {
var clazz = declare([BaseWidget, _WidgetsInTemplateMixin], {
baseClass: 'please-help-solve',
_textGeometry: null,
_textSymbol: null,
_textGraphics: null,
_textLayer: null,
postCreate: function() {
this.inherited(arguments);
// Creates graphics layer for the text
this._textLayer = new GraphicsLayer({
id: 'text_lyr',
title: 'Labels'
})
this.map.addLayer(this._textLayer)
// Creates the font, color, and textSymbol
var myFont = new esri.symbol.Font()
myFont.setSize("12pt")
myFont.setWeight(Font.WEIGHT_BOLD)
var myColor = new Color([255,0,0])
this._textSymbol = new TextSymbol("TEST", myFont, myColor)
// Creates the geometry, graphic, and adds it to the layer
this._textGeometry = new Point(this.map.extent.getCenter().getLongitude(),
this.map.extent.getCenter().getLatitude())
this._textGraphics = new Graphic({
geometry: this._textGeometry,
symbol: this._textSymbol,
attributes: {}
})
this._textLayer.add(this._textGraphics)
}
})
}
)