Community
Select to view content in your preferred language

PictureMarkerSymbol - Assign border, or css styling

2048
3
02-18-2014 11:14 PM
MartinSirkovsky
by
Regular Contributor
‎02-18-2014 11:14 PM
Hi.

I have created a map which shows properties for sale. Map can be seen here: http://fastognir.kort.fo

When I zoom in on map, the symbols which identify the location of the property change to images of the properties. I define the image by PictureMarkerSymbol.

When zoomed out I use different colors to differentiate between property types, such as terraced, semi terraced, apartment, bungalow, etc.... I would like to propagate this colors unto the images. So my questions are:




  1. Is there a way to add a border around the PictureMarkerSymbol, preferably border on right side, 15px wide.

  2. Is there a way to change the properties of the image by css. I tried and I have successfully added a custom css style by using jquery selectors on the fly once the images are generated by using event listner (on map update end), but the sytling didn't show on the map.


Currently I solved the problem by adding a new grapahic layer, which adds borders, but this is not optimal, especially in areas where images are overlapping. Also I do not like the idea of using multiple graphics layers if not necessary.

Attached images show the zoom in and zoom out state of the map.

[ATTACH=CONFIG]31570[/ATTACH]
[ATTACH=CONFIG]31571[/ATTACH]

Thanks,
Martin
Preview file
104 KB
Preview file
8 KB
0 Kudos
3 Replies
by Anonymous User
Not applicable
‎02-19-2014 01:50 AM
Original User: pepatosp

Hi.

I have created a map which shows properties for sale. Map can be seen here: http://fastognir.kort.fo

When I zoom in on map, the symbols which identify the location of the property change to images of the properties. I define the image by PictureMarkerSymbol.

When zoomed out I use different colors to differentiate between property types, such as terraced, semi terraced, apartment, bungalow, etc.... I would like to propagate this colors unto the images. So my questions are:




  1. Is there a way to add a border around the PictureMarkerSymbol, preferably border on right side, 15px wide.

  2. Is there a way to change the properties of the image by css. I tried and I have successfully added a custom css style by using jquery selectors on the fly once the images are generated by using event listner (on map update end), but the sytling didn't show on the map.


Currently I solved the problem by adding a new grapahic layer, which adds borders, but this is not optimal, especially in areas where images are overlapping. Also I do not like the idea of using multiple graphics layers if not necessary.

Attached images show the zoom in and zoom out state of the map.

[ATTACH=CONFIG]31570[/ATTACH]
[ATTACH=CONFIG]31571[/ATTACH]

Thanks,
Martin


What if you use a PictureFillSymbol and work the outline property instead of using PictureMarkerSymbol? Is this feasible?
0 Kudos
MartinSirkovsky
by
Regular Contributor
‎02-19-2014 04:01 AM
That's a good idea and I will give it a try.

But I am not sure that you can define a border just on one side of the feature by using PictureFillSymbol.

-------
Martin
0 Kudos
by Anonymous User
Not applicable
‎02-19-2014 04:24 AM
Original User: pepatosp

That's a good idea and I will give it a try.

But I am not sure that you can define a border just on one side of the feature by using PictureFillSymbol.

-------
Martin


I think you're right. Using the API standard approach, you'll probably end with a border around the whole picture. What you can do is to control the type, color and size of this border.
0 Kudos