Basic custom marker

To add a marker select the 'Styles' tab under Home » Administration » Structure » OpenLayers. Here you can [+ Add] a new marker.

Once you have created a marker you can choose it for the style of your layer. Go to edit your map from the 'Maps' tab under Home » Administration » Structure » OpenLayers. In the 'Layers & Styles' selection you should now be able to select your new style.

Selecting markers dynamically

Note: Given this commit, OpenLayers has changed its way of using field styles. If you were using replacement tokens such as ${xyz_render}, you need update your settings with the following steps.

You can change the file that is accessed for the marker based on replacement tokens from your view.

Go to your view, and select the 'OpenLayers Data' display. At the top of the preview you will see some text like:

You can use the following parameters in your styles as dynamic values

${title}
${field_point}
${name}

These tokens can be used in the externalGraphic url field of your style.

Example: Selecting by icon by Content Type

In your view:

  1. Go to your view 'Openlayers Data' display.
  2. Add the 'Content: Type' field
  3. You usually don't want the field to be stylized with HTML and CSS, as they will appear in the filenames of your icons. Set the formatter of the field to be 'Plain Text'. In the Style Settings, under 'Customize field HTML' and 'Customize field and label wrapper HTML' choose HTML elements to be 'None'.

You should now see additional tokens in the preview section:

${type}

In Openlayers styles section:

  1. Go to the 'OpenLayers' settings page select the 'Styles' tab and add a new 'Style'.
  2. Under 'externalGraphic' in the section 'Style Properties', enter the URL to where you are going to store your icons using the new token
    ${type} to be replaced with the content type name e.g. sites/all/themes/[YOUR-THEME_NAME]/css/images/icons/icon-${type}.png

Add your icons:

Add your icon images to this folder. E.g. for a content type with a human readable name of 'Location', your icon's file name will be icon-Location.png

Openlayers preview in the view does not give examples of the exact replacement. For some fields you might not be sure what is going to be replaced. One way to work out the exact filenames is to try using the style and check the logs for the filenames of the not found images.

In your map:

In the Layers & Styles section you can now select this style to be used for your layer. If you use this style with a view without the field, for the token, 'undefined' will be used instead (so in this example: icon-undefined.png).

Comments

milos.kroulik’s picture

Since we can set the dynamic style also through Openlayers Data Overlay options, this approach should be also documented here. Please discuss this issue at https://drupal.org/node/2112881

leandro713’s picture

i'm following the above steps and i am rendering a taxonomy field in my openlayers view for naming the image of the marker. I render this taxonomy field as tid because i have blank spaces in their taxonomy names.
So i get no error in the view and i can see

'field_deal_category_rendered' => '34',
'field_deal_category' => 'Health & Beauty',

and in my externalGraphic i have set it to images/icon-${field_deal_category_rendered}.png

but i always get a url for the marker as "icon-.png" (it can't get the field), obviously the marker is never shown :/
also when i browse the map page i get this error

Notice: Undefined index: taxonomy_term in taxonomy_field_formatter_view() (line 1610 of /var/www/html/modules/taxonomy/taxonomy.module). =>

seems a drupal core issue, but i dont want to hack the core :(
any suggestion?

leandro713’s picture

finally i solved it turning the format of the taxonomy as «link» in the openlayers view.
Not sure about why this way works :(
Not sure about anything on this issue at all :/

B.Friddy’s picture

I was experiencing the same issue as leandro713 - thanks for the suggestion. I wasn't able to get my icon to display with link as a formatter option, instead "separated" as a formatter option worked for me.

suburbanmarx’s picture

I thought I was following the example closely, yet, I am getting some rogue divs alongside the style parameter that I'm trying to use which is not translating to the map with a clean filename (results in sites/default/files/openlayers/icons/icon-%3Cdiv%3EStore%3C/div%3E.png).

Anyone have the same experience and was able to figure out how to get rid of the last div's that aren't trimmed out by overriding the field's style settings?

I'm very simply trying to get each node represented via taxonomy on a map with it's corresponding icon/marker identified. I have a also tried a simple text field with the raw value (e.g. 'store') and it doesn't work either.

I don't know what other info might be of use. Any ideas or suggestions would be extremely helpful. Thanks.

pixelsweatshop’s picture

Commenting in the handbook is not the place to get support. No one is watching this page other than the authors. Use the open layers issue queue or the forums.