defination list html 调整颜色,html

html

Usage

view: view_name {

dimension: field_name {

    html:%7B%7B%20value%20%7D%7D.jpg ;;

}

}

Possible Field Types

Dimension, Dimension Group, Measure

Accepts

An HTML expression, possibly using Liquid template elements, followed by two semicolons

Definition

The html parameter enables you to specify the HTML that will be contained by a field.

You can also get access to the values that would typically be in the field by using Liquid variables. This allows you to create a number of useful functions, including links to other related Looks, links to external websites, or images.

Using valid HTML

In order to prevent certain security exploits, Looker restricts which HTML tags and attributes may be used, as well as which CSS properties may be used. See our HTML sanitization documentation page for more details.

Liquid variables

The html parameter supports Liquid variables. See the Liquid variables documentation page for information about how to make full use of these variables.

Examples

Here are some examples for using the html field parameter.

HTML formatting only renders in table, table (legacy), and single value chart visualizations and in visualization tooltips when combining multiple fields. Any interactive content placed in a map chart’s tooltip with the html parameter will not be accessible on dashboards that use the new dashboard experience, although it will be accessible on Looks, Explores, and legacy dashboards.

Using Liquid variables in the html parameter

This example shows how most of the Liquid variables would appear in an html parameter. Consider a total_order_amount definition:

measure: total_order_amount {

type: sum

sql: ${order_amount} ;;

value_format: "0.00"

html:

  • value: {{ value }}
  • rendered_value: {{ rendered_value }}
  • linked_value: {{ linked_value }}
  • link: {{ link }}
  • model: {{ _model._name }}
  • view: {{ _view._name }}
  • explore: {{ _explore._name }}
  • field: {{ _field._name }}
  • dialect: {{ _dialect._name }}
  • access filter: {{ _access_filters['company.name'] }}
  • user attribute: {{ _user_attributes['region'] }}
  • query timezone: {{ _query._query_timezone }}
  • filters: {{ _filters['order.total_order_amount'] }}
;;

}

The cell value displayed for total_order_amount would look like this:

• value: 8521935

• rendered_value: 8,521,935.00

• linked_value: 8,521,935.00

• link: /explore/thelook/orders?fields=orders.order_amount&limit=500

• model: thelook

• view: orders

• explore: order_items

• field: total_order_amount

• dialect: mysql

• access filter: brettcase.com

• user attribute: northeast

• query timezone: America/Los_Angeles

• filters: NOT NULL

Conditionally format a count according to its values:

measure: formatted_count {

type: count

html:

{% if value > 100 %}

{{ rendered_value }}

{% elsif value > 50 %}

{{ rendered_value }}

{% else %}

{{ rendered_value }}

{% endif %} ;;

}

Exploring data with the html parameter

HTML formatting only renders in table, table (legacy), and single value chart visualizations and in visualization tooltips when combining multiple fields. Any interactive content placed in a map chart’s tooltip with the html parameter will not be accessible on dashboards that use the new dashboard experience, although it will be accessible on Looks, Explores, and legacy dashboards.

Imagine you have a field in your data called status, which gives the status of each order. The possible values for status are:

Paid

Shipped

Returned

While exploring your data, you might want to have a separate background color for each status. This can be done using Liquid html in the html: parameter of a dimension. This would look something like:

dimension: status {

sql: ${TABLE}.status ;;

html: {% if value == 'Paid' %}

{{ rendered_value }}

{% elsif value == 'Shipped' %}

{{ rendered_value }}

{% else %}

{{ rendered_value }}

{% endif %}

;;

}

In your table, this will look like:

4c6cd201827bde09640486f47ffcdf00.png

You can use the same syntax to add icons or images based on cell values:

dimension: status {

sql: ${TABLE}.status ;;

html: {% if value == 'Shipped' or value == 'Complete' %}

ea691b8fa08fdd195e0176b761823673.png{{ rendered_value }}

{% elsif value == 'Processing' %}

345e06f4a36c0fe45b10af14cf757268.png{{ rendered_value }}

{% else %}

a9c5b60a8d67426c472b52bcea17b01f.png{{ rendered_value }}

{% endif %}

;;

}

In your table, this will look like:

b15abb3ef16d4a4fb627508c21b592ee.png

Generating product images

Here is an example of how to add the picture of a product into Looker using an tag, based on the product’s ID:

dimension: product_image {

sql: ${product_id} ;;

html: %7B%7B%20value%20%7D%7D.jpg ;;

}

Maintaining drill-down links

To maintain drill-down links when formatting output using the html parameter, you can include the HTML tag . For example:

measure: count {

type: count

drill_fields: [detail*]

html:

{% if value > 10000 %}

{{ rendered_value }}

{% elsif value > 5000 %}

{{ rendered_value }}

{% else %}

{{ rendered_value }}

{% endif %}

;;

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值