Style Point Data with Marker Images

Styling Guides

Style Point Data with Marker Images

If your map layer contains point geometries, you can display a marker image for each point of your data by applying a SVG file as the marker file. CARTO provides a selection of marker images to choose from, or you can upload your own marker files through the STYLE options in CARTO Builder. If you are an Enterprise user, the organization owner can add and manage marker images for the whole organization.

You can apply marker images using solid color properties, display multiple marker images to represent category data, and adjust the size of the marker images.

Your data must contain point geometries and you cannot add marker images when an analysis is applied to a map layer.

Marker Images with Solid Color Properties

For this guide, apply a marker image to appear for each point geometry.

  1. Import the template .carto file packaged from the "Download resources" of this guide and create the map. Builder opens with NYC Public Schools as the first map layer, and Library Locations as the second map layer.

    Click on "Download resources" from this guide to download the zip file to your local machine. Extract the zip file to view the .carto file(s) used for this guide.
  2. Select the Library Locations layer.

  3. Click the COLOR to open the color picker. The SOLID tab is selected by default.

  4. Click the IMG subtab.

    A list of the most used marker images appear.

    IMG tab from STYLE options

  5. Click Show full collections.

    The Select marker image options appear.

    You can upload and select your own icons to be used for marker images through the UPLOAD FILE and YOUR UPLOADS options.
  6. Select the library icon (which looks like a book).

    Select library marker image

  7. Click SET IMAGE.

    The Map View displays the selected image as the marker.

    If you switch to the CartoCSS view of the STYLE tab, note that the marker-file CartoCSS property was applied behind the scenes.
  8. Click on the solid color to view the color picker, and enter 645b5b in the HEX input field

    Modify solid color

    The marker image displays the solid color applied.

  9. To modify the size of the marker image, click the SIZE value and enter 14.

Modify size

Marker Images for Categorical Data

If your map layer contains point geometries, and you are styling the layer BY VALUE using a string value to represent categories of data, you can apply unique marker images for each category of data.

  1. Select the NYC Public Schools layer.

  2. Click the COLOR to open the color picker. The SOLID tab is selected by default.

  3. Click the BY VALUE tab.

  4. Select a string or boolean column from your map layer sch_type. Builder assigns a default qualitative CARTOColor scheme for each category of data.

    Style by value

    You can use the color picker to modify any of the color properties for the selected value, and add a marker image for each category.

    CARTO Builder allows you to style up to ten categories of data.
    • Click img next to the Elementary value and select the playground image marker for this value.
    • Apply marker images for the rest of the school types and experiment with the BLENDING mode for the composite operation, which define how the markers interact.

      Apply multiple marker images

Download the final .carto file, packaged from the "Download resources" of this guide, to view all of the marker images that were applied to each category of data. Explore the data by using the widgets to filter markers on the map. Additionally, note the other minor adjustments that should be applied in order to tweak the styling around markers:

Shared Organization Markers

If you have an Enterprise account, the organization owner can define which markers appear from the Select marker image options for all users.

These markers are defined through the Icons section of the Organization profile of the organization settings.

Organization settings for markers

If you are an Enterprise user, the following example shows the additional ORGANIZATION UPLOADS when selecting marker images for point data.

Organization uploads of marker images