# Customize tiles' sources

{% hint style="warning" %}
Warning

This option is only available from the code mode.
{% endhint %}

### Tile’s custom sources[¶](https://github.com/ToucanToco/doc-v3/blob/main/visualizations-and-layouts/creating-visualizations/advanced-chart-configuration/broken-reference/README.md)

Yes, you can have custom source based on data 😃 That means your source can come directly from your data source. Awesome!

To do so:

* you need to process a new data query under `source`
* the `field` property allows to select the default columns you want to access with `source`, it’s the column containing the source value
* Other columns present in the data are available with this syntax: `source.COLUMN_NAME`. i.e: your source is the country and the date, which are in two different columns.

### Ex1: Simple source[¶](https://github.com/ToucanToco/doc-v3/blob/main/visualizations-and-layouts/creating-visualizations/advanced-chart-configuration/broken-reference/README.md)

Your source is the date.

**Data structure**

```coffeescript
| label      | value_ex | date | pays   |
|------------|----------|------|--------|
| Lorem      | 1        |10/16 | Paris  |
| ipsum      | 2        |11/16 | Lisboa |
| dolor      | 3        |12/16 | Rome   |
```

**Configuration**

```coffeescript
{
  name: "Metric"
  type: 'value-dynamic'
  value: "value"
  unit: "%"
  slide: 32204
  badge: 'badge'
  sentiment:
    value:
      domain: ['comparison']
      range: ['negative','positive']
  precision:
    value: '.1f'
  data:
    value:
      query:
        domain: "ranks"
      field: "value"
    source:
      query:
        domain: "ranks"
      field: ["date"]
  compute:
    badge: 'value - comparison'
  source: "Last update: <%= source.date %>"
}
```

### Ex2: Multiple sources

Your source is the country and the date, which are in two different columns.

**Data structure**

```coffeescript
| label      | value_ex | date | pays   |
|------------|----------|------|--------|
| Lorem      | 1        |10/16 | Paris  |
| ipsum      | 2        |11/16 | Lisboa |
| dolor      | 3        |12/16 | Rome   |
```

**Configuration**

```coffeescript
{
  name: "Metric"
  type: 'value-dynamic'
  value: "value"
  unit: "%"
  slide: 32204
  badge: 'badge'
  sentiment:
    value:
      domain: ['comparison']
      range: ['negative','positive']
  precision:
    value: '.1f'
  data:
    value:
      query:
        domain: "ranks"
      field: "value"
    source:
      query:
        domain: "ranks"
      field: ["date", "pays"]
  compute:
    badge: 'value - comparison'
  source: "Last update: <%= source.date %>, from <%= source.pays %>"
}
```
