I want the user to be able to select the symbol of the features on the map. Currently I just have symbol names, can I replace these with actual symbols? (Circle, Square, Cross, etc.)
I'm not sure I understand your question very well, but assuming you have a style item with myltiple symbols (either published by you or by esri) you could request the symbols in that style and they have thumbnails that you can display in a drop-down list.
So for example for the icons style: https://www.arcgis.com/home/item.html?id=a91ce080e9414810b71d55edc51b5837 you could make a request to get the item and then request the data associated with it using fetchData().
const portal = new Portal({url: "https://www.arcgis.com"});
portal.load().then(function() {
// Create query parameters for the portal search
const queryParams = new PortalQueryParams({
query: "id: a91ce080e9414810b71d55edc51b5837"
});
// Get the item based on the queryParams created from portal above
portal.queryItems(queryParams).then(function(items){
return items.results[0].fetchData();
})
.then(createDropDown);
});
I made a live sample here: https://codepen.io/ralucanicola/pen/PoYNrNJ?editors=1000