by
Hello,
I want to know How can I change the pin location image in map? I want to give my custom image as shown in image
by
The code is now working, But I need help in removing the blue highlight color after clicking the pin image.I am sharing my code.
var views = new MapView({
container: "viewDiv",
map: map,
center: [20,40],
zoom: 16,
popup: {
dockEnabled: true,
dockOptions: {
buttonEnabled: false,
breakpoint: false
}
}
});
let centroidRenderer = {
type: "simple",
symbol: {
type: "picture-marker",
url: "images/Location-map.png",
width: "26",
height: "26"
}
};
let locationpin = new FeatureLayer({
url:
renderer: centroidRenderer,
popupTemplate : popupTemplate
});
var maps = new Map({
basemap: "dark-gray",
layers: [locationpin]
});
// var privateSchoolsPoly = new FeatureLayer({
// url:
// outFields: ["*"],
// opacity: 0.8,
// renderer: renderer,
// });
function getGraphics(response) {
view.graphics.removeAll();
if (response.results.length > 0) {
var graphic = response.results[0].graphic;
graphic.symbol = {
type: "picture-marker",
// url: "images/Location-Red.png",
width: "26",
height: "26"
}
view.graphics.add(graphic);
}
}
view.when(function () {
view.whenLayerView(locationpin).then(function (lview) {
watchUtils.whenFalseOnce(lview, "updating", function () {
// Set up a click event handler and retrieve the screen x, y coordinates
view.on("click", function (evt) {
var screenPoint = {
x: evt.x,
y: evt.y
};
// the hitTest() checks to see if any graphics in the view
// intersect the given screen x, y coordinates
view.hitTest(screenPoint)
.then(function (response) {
// changeCursor(response);
getGraphics(response);
});
});
});
});
});
view.when(function() {
map.addMany([locationpin]);
});
by
by
