# Simple visualizations

Simple visualizations are those that show each feature in a vector dataset using the same style or the image as it is in raster ones.

Simple visualizations must define `"type": "simple"` and a single value for each supported style and label properties.

### Vector example

The Airports layer in Felt is an example of a simple visualization using a vector dataset

![](https://293097899-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLlIfNdbm4rCsu755xrdc%2Fuploads%2F801reypHVv0Jqoj9H86x%2FScreenshot%202022-07-28%20at%2017.04.07.png?alt=media\&token=26cfb948-eec4-44be-a207-ea04e54d0f52)

and is defined by the following style:

```jsx
{
  "attributes": {
    "ele": {"displayName": "Elevation (meters)"},
    "faa": {"displayName": "FAA Code"},
    "iata": {"displayName": "IATA Code"},
    "icao": {"displayName": "ICAO Code"},
    "name": {"displayName": "Name"},
    "name_en": {"displayName": "Name (EN)"},
    "wikipedia": {"displayName": "Wikipedia entry"}
  },
  "config": {"labelAttribute": ["name_en", "name"]},
  "filters": [["name", "isnt", null], "and", ["name", "ne", ""]],
  "label": {
    "color": "hsl(40,30%,40%)",
    "fontSize": {"linear": [[12, 12], [20, 20]]},
    "fontStyle": "Normal",
    "fontWeight": 400,
    "haloColor": "hsl(40,20%,85%)",
    "haloWidth": 1.5,
    "justify": "auto",
    "letterSpacing": 0.1,
    "lineHeight": 1.2,
    "maxLineChars": 10,
    "maxZoom": 23,
    "minZoom": 10,
    "offset": [8, 0],
    "padding": 10,
    "placement": ["E", "W"],
    "visible": true
  },
  "legend": {},
  "paint": {
    "color": "hsl(40,30%,80%)",
    "highlightColor": "#EA3891",
    "highlightStrokeColor": "#EA3891",
    "highlightStrokeWidth": {"linear": [[3, 0], [20, 2]]},
    "isSandwiched": false,
    "opacity": 1,
    "size": {"linear": [[3, 1], [20, 6]]},
    "strokeColor": "hsl(40,20%,55%)",
    "strokeWidth": {"linear": [[3, 0.5], [20, 2]]}
  },
  "version": "2.3"
}
```

### Raster example

This is an example of a simple visualization using a raster dataset

![](https://293097899-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FLlIfNdbm4rCsu755xrdc%2Fuploads%2FMkAXLFM9oCVc4oKkyQW5%2FScreenshot%202024-04-12%20at%2013.17.15.png?alt=media\&token=86b25735-96a6-4745-81f3-cb0f24b7d5db)

and is defined by the following style:

```jsx
{
  "version": "2.3",
  "type": "simple",
  "config": {},
  "paint": {"isSandwiched": false, "opacity": 0.93}
}
```