Tabel properti Visualisasi dan Kueri

Visualization

Komponen ini mengambil data dan konfigurasi dari konteks kueri serta merender visualisasi yang sesuai. Anda dapat menyesuaikan lebar dan tinggi dengan meneruskan nilai piksel numerik ke properti tersebut.

Properti Nilai Catatan
width angka (dalam piksel) Default 100% jika properti tidak ditentukan.
height angka (dalam piksel) Default 500 piksel jika properti tidak ditentukan.
chartTypeMap objek kunci/nilai Menerima objek nilai/kunci yang menentukan komponen yang akan dirender saat sistem adaptor menemukan nilai jenis diagram tertentu. Tindakan ini dapat digunakan untuk mengganti diagram default Looker atau menambahkan jenis diagram baru ke sistem adaptor.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'
import { MyCustomRadar } from '../MyCustomRadar'

<Query query='12345' config={{ type: 'radar'}}>
   <Visualization
      width={1000}
      height={500}
      chartTypeMap={{ radar: MyCustomRadar}}
    />
</Query>

Query

Query terintegrasi dengan JavaScript API kami untuk menangani siklus permintaan/respons dan untuk mengambil respons kueri berdasarkan ID kueri atau nilai qid. Anda dapat meneruskan penggantian konfigurasi vis untuk digabungkan dengan respons API, dan memuat semua data ke dalam konteks React.

Properti Nilai Catatan
query angka | {i>string<i} Dapat menerima Query.client_id, yang muncul setelah properti qid di URL Jelajah, (3fdrdE0b3ATltUvXBaSOPN), atau ID kueri numerik (1234). Jika Anda memiliki akses ke ID kueri numerik, satu permintaan server tambahan dapat disimpan berdasarkan nilai ini.

Query menerima properti query atau properti dashboard, tetapi tidak keduanya.
dashboard angka Dapat menerima ID dasbor numerik (1234). Jika Anda memiliki akses ke ID dasbor numerik, mulai dari nilai ini dapat menyimpan satu permintaan server tambahan.

dashboard tidak menerima ID string dasbor LookML.

Query menerima properti query atau properti dashboard, tetapi tidak keduanya.
config Bergantung pada nilai type, menerima properti berikut:

type, legend, positioning, render_null_values, tooltips, series, x_axis, y_axis

Lihat dokumentasi khusus diagram nanti di halaman ini untuk mengetahui nilai yang didukung.
Menetapkan dan mengganti setelan konfigurasi untuk diagram.
LoadingIndicator referensi komponen Menerima referensi komponen yang dilepas. Default: ProgressCircular

import { Visualization, Query } from '@looker/visualizations'
import { ProgressCircular } from '@looker/components'

<Query
  query='12345'
  config={{
      /* specific properties described later on this page */
  }}
  LoadingIndicator={ProgressCircular}
>
  <Visualization />
</Query>

Properti diagram area

Berikut adalah properti config untuk diagram area.

Properti Nilai Catatan
type 'area'
legend false (untuk menonaktifkan) ATAU { position: 'left' | 'bottom' | 'right' | 'top' } Menetapkan posisi legenda atau menonaktifkan legenda dengan menyetelnya ke false.

Default: { position: 'bottom' }
positioning 'overlay' | 'stacked' | 'percent' Mode penumpukan diagram. Default: 'overlay'
render_null_values boolean Memperlakukan nilai null sebagai 0. Default: false
tooltips boolean Aktifkan atau nonaktifkan tooltip yang muncul saat mengarahkan kursor ke titik data. Default: true
series serial dalam format view_name.field_name Lihat bagian serial untuk opsi konfigurasi dan contoh penggunaan.
x_axis konfigurasi sumbu x Lihat bagian sumbu x untuk opsi konfigurasi dan contoh penggunaan.
y_axis konfigurasi sumbu y Lihat bagian sumbu y untuk opsi konfigurasi dan contoh penggunaan.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'area',
    legend: { position: 'left' },
    positioning: 'stacked',
    render_null_values: true,
    tooltips: true,
  }}
>
  <Visualization />
</Query>

series

Properti series dapat menerima array konfigurasi deret atau objek bernama yang menggantikan deret tertentu dalam respons Anda.

Properti Nilai Catatan
color string Kode heksadesimal
label string
line_width angka Setel lebar goresan garis dalam piksel. Default: 3
shape 'circle' | 'diamond' | 'square' | 'triangle' | 'triangle-down' Tetapkan bentuk titik. Default: 'circle'
style 'none' | 'filled' | 'outline' Tetapkan gaya titik. Default: 'none' (poin dinonaktifkan)
visible boolean Menampilkan atau menyembunyikan deret data. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

/* named series overrides */
<Query
  query='12345'
  config={{
    type: 'area',
    series: {
      'orders.count': {
        color: '#4285F4',
        label: 'Total Orders',
        shape: 'square',
      }
    }
  }}
>
  <Visualization />
</Query>

/* ordered list series overrides */
<Query
  query='12345'
  config={{
    type: 'area',
    series: [{ color: '#4285F4', label: 'Total Orders', shape: 'square' }],
  }}
>
  <Visualization />
</Query>

x_axis

Meskipun diagram kami saat ini hanya mendukung sumbu x tunggal, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu x. Default: false (tanpa label)
reversed boolean Membalik urutan titik data. Default: false
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'area',
      x_axis: [{ gridlines: true, label: 'Date of first purchase' }],
    }}
  >
    <Visualization />
  </Query>

y_axis

Meskipun diagram kami saat ini hanya mendukung satu sumbu y, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false.
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu y. Default: false (tanpa label)
range [angka (minimum) | 'auto', angka (maks) | 'auto'] Menetapkan nilai minimum dan maksimum dari sumbu y. Menyetel minimum ke 'auto' akan ditetapkan secara default ke 0, dan menetapkan nilai maksimum ke 'auto' akan ditetapkan secara default ke nilai titik data maksimum dalam kumpulan. Default: ['auto' | 'auto']
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'area',
      y_axis: [
        { gridlines: true, label: 'Number of orders', range: [50, 'auto'] },
      ],
    }}
  >
    <Visualization />
  </Query>

Properti diagram batang dan kolom

Berikut adalah properti config untuk diagram batang dan kolom.

Properti Nilai Catatan
type 'bar' | 'column'
legend false (untuk menonaktifkan) ATAU { position: 'left' | 'bottom' | 'right' | 'top' } Menetapkan posisi legenda atau menonaktifkan legenda dengan menyetelnya ke false. Default: { position: 'bottom' }
positioning 'grouped' | 'stacked' | 'percent' Mode penumpukan diagram. Default: 'overlay'
tooltips boolean Aktifkan atau nonaktifkan tooltip yang muncul saat mengarahkan kursor ke titik data.

Default: true
series serial dalam format view_name.field_name Lihat bagian serial untuk opsi konfigurasi dan contoh penggunaan.
x_axis konfigurasi sumbu x Lihat bagian sumbu x untuk opsi konfigurasi dan contoh penggunaan.
y_axis konfigurasi sumbu y Lihat bagian sumbu y untuk opsi konfigurasi dan contoh penggunaan.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'bar',
    legend: { position: 'left' },
    positioning: 'stacked',
    tooltips: true,
  }}
>
  <Visualization />
</Query>

series

Properti series dapat menerima array konfigurasi deret atau objek bernama yang menggantikan deret tertentu dalam respons Anda.

Properti Nilai Catatan
color string Kode heksadesimal
label string
visible boolean Menampilkan atau menyembunyikan deret data. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'column',
    series: {
      'orders.count': {
        color: '#4285F4',
        label: 'Total Orders',
        visible: false,
      },
    },
  }}
>
  <Visualization />
</Query>

/* ordered list series overrides */
<Query
  query='12345'
  config={{
    type: 'column',
    series: [{ color: '#4285F4', label: 'Total Orders', visible: false }],
  }}
>
  <Visualization />
</Query>

x_axis

Meskipun diagram kami saat ini hanya mendukung sumbu x tunggal, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false.
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu x. Default: false (tanpa label)
reversed boolean Membalik urutan titik data. Default: false
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'column',
      x_axis: [{ gridlines: true, label: 'Date of first purchase' }],
    }}
  >
    <Visualization />
  </Query>

y_axis

Meskipun diagram kami saat ini hanya mendukung satu sumbu y, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false.
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu y. Default: false (tanpa label)
range [angka (minimum) | 'auto', angka (maks) | 'auto'] Menetapkan nilai minimum dan maksimum dari sumbu y. Menyetel mnt ke 'otomatis' nilai default-nya adalah 0, dan menyetel nilai maksimum ke 'otomatis' secara default ke nilai titik data maksimum dalam set. Default: ['auto' | 'auto'].
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'bar',
      y_axis: [
        { gridlines: true, label: 'Number of orders', range: [500, 'auto'] },
      ],
    }}
  >
    <Visualization />
  </Query>

Properti diagram garis

Berikut adalah properti config untuk diagram garis.

Properti Nilai Catatan
type 'line'
legend false (untuk menonaktifkan) ATAU { position: 'left' | 'bottom' | 'right' | 'top' } Menetapkan posisi legenda atau menonaktifkan legenda dengan menyetelnya ke false. Default: { position: 'bottom' }
render_null_values boolean Memperlakukan nilai null sebagai 0. Default: false
tooltips boolean Aktifkan atau nonaktifkan tooltip yang muncul saat mengarahkan kursor ke titik data. Default: true
series serial dalam format view_name.field_name Lihat bagian serial untuk opsi konfigurasi dan contoh penggunaan.
x_axis konfigurasi sumbu x Lihat bagian sumbu x untuk opsi konfigurasi dan contoh penggunaan.
y_axis konfigurasi sumbu y Lihat bagian sumbu y untuk opsi konfigurasi dan contoh penggunaan.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'line',
    legend: { position: 'left' },
    render_null_values: true,
    tooltips: true,
  }}
>
  <Visualization />
</Query>

series

Properti series dapat menerima array konfigurasi deret atau objek bernama yang menggantikan deret tertentu dalam respons Anda.

Properti Nilai Catatan
color string Kode heksadesimal
label string
line_width angka Setel lebar goresan garis dalam piksel. Default: 3
shape 'circle' | 'diamond' | 'square' | 'triangle' | 'triangle-down' Tetapkan bentuk titik. Default: 'circle'
style 'none' | 'filled' | 'outline' Tetapkan gaya titik. Default: 'none' (poin dinonaktifkan)
visible boolean Menampilkan atau menyembunyikan deret data. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

/* named series overrides */
<Query
  query='12345'
  config={{
    type: 'line',
    series: {
      'orders.count': {
        color: '#4285F4',
        label: 'Total Orders',
        shape: 'square',
      },
    },
  }}
>
  <Visualization />
</Query>

/* ordered list series overrides */
<Query
  query='12345'
  config={{
    type: 'line',
    series: [{ color: '#4285F4', label: 'Total Orders', shape: 'square' }],
  }}
>
  <Visualization />
</Query>

x_axis

Meskipun diagram kami saat ini hanya mendukung sumbu x tunggal, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false.
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu x. Default: false (tanpa label)
reversed boolean Membalik urutan titik data. Default: false
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'line',
      x_axis: [{ gridlines: true, label: 'Date of first purchase' }],
    }}
  >
    <Visualization />
  </Query>

y_axis

Meskipun diagram kami saat ini hanya mendukung satu sumbu y, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu y. Default: false (tanpa label)
range [angka (minimum) | 'auto', angka (maks) | 'auto'] Menetapkan nilai minimum dan maksimum dari sumbu y. Menyetel mnt ke 'otomatis' nilai default-nya adalah 0, dan menyetel nilai maksimum ke 'otomatis' secara default ke nilai titik data maksimum dalam set. Default: ['auto' | 'auto'].
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'line',
      y_axis: [
        { gridlines: true, label: 'Number of orders', range: [500, 'auto'] },
      ],
    }}
  >
    <Visualization />
  </Query>

Properti diagram sebar

Berikut adalah properti config untuk diagram sebar.

Properti Nilai Catatan
type 'scatter'
legend false (untuk menonaktifkan) ATAU { position: 'left' | 'bottom' | 'right' | 'top' } Menetapkan posisi legenda atau menonaktifkan legenda dengan menyetelnya ke false. Default: { position: 'bottom' }
render_null_values boolean Memperlakukan nilai null sebagai 0. Default: false
tooltips boolean Aktifkan atau nonaktifkan tooltip yang muncul saat mengarahkan kursor ke titik data. Default: true
series serial dalam format view_name.field_name Lihat bagian serial untuk opsi konfigurasi dan contoh penggunaan.
x_axis konfigurasi sumbu x Lihat bagian sumbu x untuk opsi konfigurasi dan contoh penggunaan.
y_axis konfigurasi sumbu y Lihat bagian sumbu y untuk opsi konfigurasi dan contoh penggunaan.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'scatter',
    legend: { position: 'left' },
    render_null_values: true,
    tooltips: true,
  }}
>
  <Visualization />
</Query>

series

Properti series dapat menerima array konfigurasi deret atau objek bernama yang menggantikan deret tertentu dalam respons Anda.

Properti Nilai Catatan
color string Kode heksadesimal
label string
line_width angka Digunakan untuk menentukan ukuran titik di sebuah diagram pencar. Anggap saja hal itu sebagai garis besar dari setiap poin. Default: 3
shape 'circle' | 'diamond' | 'square' | 'triangle' | 'triangle-down' Tetapkan bentuk titik. Default: 'circle'
style 'none' | 'filled' | 'outline' Tetapkan gaya titik. Default: 'none' (poin dinonaktifkan)
size_by false | {i>string<i} Nama deret yang akan dikalibrasi ukuran setiap titik. Setel false untuk menonaktifkan pengukuran titik dinamis. Default: false
visible boolean Menampilkan atau menyembunyikan deret data. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

/* named series overrides */
<Query
  query='12345'
  config={{
    type: 'scatter',
    series: {
      'orders.count': {
        color: '#4285F4',
        label: 'Total Orders',
        shape: 'square',
        size_by: 'orders.count',
      },
    },
  }}
>
  <Visualization />
</Query>

/* ordered list series overrides */
<Query
    query='12345'
    config={{
      type: 'scatter',
      series: [
        {
          color: '#4285F4',
          label: 'Total Orders',
          shape: 'square',
          size_by: 'orders.count',
        },
      ],
    }}
  >
    <Visualization />
  </Query>

x_axis

Meskipun diagram kami saat ini hanya mendukung sumbu x tunggal, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false.
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu x. Default: false (tanpa label)
reversed boolean Membalik urutan titik data. Default: false
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'scatter',
      x_axis: [{ gridlines: true, label: 'Date of first purchase' }],
    }}
  >
    <Visualization />
  </Query>

y_axis

Meskipun diagram kami saat ini hanya mendukung satu sumbu y, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
gridlines boolean Menampilkan atau menyembunyikan garis petak vertikal. Default: false.
label false (untuk menyembunyikan label) | string (nilai untuk dirender) Menetapkan nilai yang akan dirender sebagai label sumbu y. Default: false (tanpa label)
range [angka (minimum) | 'auto', angka (maks) | 'auto'] Menetapkan nilai minimum dan maksimum dari sumbu y. Menyetel mnt ke 'otomatis' nilai default-nya adalah 0, dan menyetel nilai maksimum ke 'otomatis' secara default ke nilai titik data maksimum dalam set. Default: ['auto' | 'auto'].
values boolean Menampilkan atau menyembunyikan nilai yang dirender di sepanjang sumbu. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

  <Query
    query='12345'
    config={{
      type: 'scatter',
      y_axis: [
        { gridlines: true, label: 'Number of orders', range: [500, 'auto'] },
      ],
    }}
  >
    <Visualization />
  </Query>

Properti diagram nilai tunggal

Berikut adalah properti config untuk diagram nilai tunggal.

Properti Nilai Catatan
type 'single_value'

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query query='12345' config={{ type: 'single_value' }}>
  <Visualization />
 </Query>

Properti diagram garis percik

Berikut adalah properti config untuk diagram garis percik.

Properti Nilai Catatan
type 'sparkline'
render_null_values boolean Memperlakukan nilai null sebagai 0. Default: false
series serial dalam format view_name.field_name Lihat bagian serial untuk opsi konfigurasi dan contoh penggunaan.
y_axis konfigurasi sumbu y Lihat bagian sumbu y untuk opsi konfigurasi dan contoh penggunaan.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query="12345"
  config={{ type: 'sparkline', render_null_values: true }}
>
  <Visualization />
</Query>

series

Meskipun Sparkline secara inheren hanya mendukung satu seri, kami mempertahankan pola API yang melibatkan penggantian rangkaian bernama atau array agar tetap konsisten dengan jenis diagram lain di library kami.

Properti Nilai Catatan
color string Kode heksadesimal
line_width angka Setel lebar goresan garis dalam piksel. Default: 3

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

/* named series overrides */
<Query
  query='12345'
  config={{
    type: 'sparkline',
    series: {
      'orders.count': {
        color: '#4285F4',
        line_width: 10,
      },
    },
  }}
>
  <Visualization />
</Query>

/* ordered list series overrides */
<Query
  query='12345'
  config={{
    type: 'scatter',
    series: [
        {
          color: '#4285F4',
          line_width: 10,
        },
      ],
  }}
>
  <Visualization />
</Query>

y_axis

Meskipun diagram kami saat ini hanya mendukung satu sumbu y, API kami sudah siap menghadapi masa depan dan terstruktur untuk mendukung konfigurasi beberapa sumbu.

Properti Nilai Catatan
range [angka (minimum) | 'auto', angka (maks) | 'auto'] Menetapkan nilai minimum dan maksimum dari sumbu y. Menyetel mnt ke 'otomatis' nilai default-nya adalah 0, dan menyetel nilai maksimum ke 'otomatis' secara default ke nilai titik data maksimum dalam set. Default: ['auto' | 'auto'].

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'sparkline',
    y_axis: [
      { range: [50, 'auto'] },
    ],
  }}
>
  <Visualization />
</Query>

Properti diagram tabel

Berikut adalah properti config untuk diagram tabel.

Properti Nilai Catatan
type 'table'
series serial dalam format view_name.field_name Lihat bagian serial untuk opsi konfigurasi dan contoh penggunaan.
column_order string[] Array nama deret (misalnya, 'orders.count') yang menunjukkan bagaimana Anda ingin kolom tabel diurutkan dari kiri ke kanan.
show_row_numbers boolean Alihkan tampilan baris total di bagian bawah tabel. Default: true
show_totals boolean Alihkan tampilan baris total di bagian bawah tabel. Default: true
show_row_totals boolean Alihkan tampilan total baris di sisi kanan tabel. Default: true
truncate_text boolean Jika true, teks sel tabel dibatasi ke satu baris dan tambahan konten akan terpotong dengan elipsis. Jika false, konten diizinkan untuk digabungkan ke beberapa baris. Default: true
truncate_header boolean Saat true, label header tabel dibatasi ke satu baris dan konten tambahan akan terpotong dengan elipsis. Saat false, header diizinkan untuk digabungkan menjadi beberapa baris. Default: true

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'table',
    column_order: ['orders.count', 'users.city'],
    show_row_numbers: true,
    show_totals: true,
    show_row_totals: true,
    truncate_text: true,
    truncate_header: true
  }}
>
  <Visualization />
</Query>

series

Properti seri dapat menerima array konfigurasi deret atau objek bernama yang menggantikan deret tertentu dalam respons Anda.

Properti Nilai Catatan
cell_visualization boolean Mengaktifkan atau menonaktifkan visualisasi sel inline. Default-nya adalah true untuk pengukuran pertama, dan false untuk pengukuran lainnya.
color string Menentukan warna yang digunakan untuk merender visualisasi sel tabel.
value_format string String pemformatan angka yang menunjukkan apakah nilai akan dirender sebagai mata uang, presisi floating point, apakah akan menggunakan koma atau titik untuk menunjukkan ribuan, dan sebagainya.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'table',
    series: {
      'orders.count': {
        color: '#4285F4',
        cell_visualization: true,
        value_format: '$#,##0.00',
      },
    },
  }}
>
  <Visualization />
</Query>

/* ordered list series overrides */
<Query
  query='12345'
  config={{
    type: 'table',
    series: [{
      color: '#4285F4',
      cell_visualization: true,
      value_format: '$#,##0.00',
    }]
  }}
>
 <Visualization />
</Query>

Properti diagram lingkaran

Berikut adalah properti config untuk diagram lingkaran.

Properti Nilai Catatan
type 'pie'
legend false (untuk menonaktifkan) | konfigurasi legenda Menyetel ke false akan menonaktifkan legenda. Default: diaktifkan. Lihat bagian legend untuk opsi konfigurasi dan contoh penggunaan saat diaktifkan.
tooltips boolean Aktifkan atau nonaktifkan tooltip yang muncul saat mengarahkan kursor ke titik data. Default: true
series serial dalam format view_name.field_name Lihat bagian serial untuk opsi konfigurasi dan contoh penggunaan.

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'pie',
    legend: false,
    tooltips: true,
  }}
>
  <Visualization />
</Query>

legend

Properti legend dapat menerima konfigurasi legenda berikut:

Properti Nilai Catatan
type 'labels' | 'legend' labels menempatkan label yang mengarah langsung ke setiap irisan. legend menempatkan legenda terpisah. Default: 'legend'
position 'top' | 'bottom' | 'left' | 'right' Posisikan legenda saat type: 'legend'. Default: 'right'
width angka Lebar maksimum legenda dalam piksel saat type: 'legend'. Default: 300
value 'label' | 'label_value' | 'value' | 'percent' | 'label_percent' Menetapkan konten legenda: label, label dan nilai, nilai, persen, label, dan persen. Default: 'label_percent'

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'pie',
    legend: {
      type: 'legend'
      position: 'right'
      width: 200,
      value: 'label_value',
    },
  }}
>
  <Visualization />
</Query>

series

Tidak seperti diagram Kartesius, setiap titik data dalam diagram lingkaran diperlakukan sebagai deret baru:

Properti Nilai Catatan
color string Kode heksadesimal

Contoh penggunaan:

import { Visualization, Query } from '@looker/visualizations'

<Query
  query='12345'
  config={{
    type: 'pie',
    series: {
      'New York': {
        color: '#4285F4',
      },
      'Los Angeles': {
        color: '#b73ec3',
      },
      'Chicago': {
        color: '#db4da8',
      },
    },
  }}
>
  <Visualization />
</Query>