Heatmap

Rekomendasi

- Konfigurasi field yang direkomendasikan: 1 metrik, 2 dimensi

- Mendukung reshape data: minimal 1 metrik, 0 dimensi

Pemetaan encoding

Heatmap mendukung kanal visual berikut:

xAxis : kanal sumbu X, mendukung beberapa dimensi, memetakan nilai dimensi ke sumbu X

yAxis : kanal sumbu Y, mendukung beberapa dimensi, memetakan nilai dimensi ke sumbu Y

detail : kanal detail, mendukung beberapa dimensi, digunakan untuk menampilkan data dengan granularitas lebih halus dalam seri warna yang sama

color : kanal warna, mendukung satu metrik, memetakan nilai metrik ke warna

tooltip: kanal tooltip, mendukung beberapa dimensi dan beberapa metrik, ditampilkan saat kursor berada di atas titik data

label : kanal label, mendukung beberapa dimensi dan beberapa metrik, menampilkan label data pada titik data

Deskripsi

Heatmap menampilkan distribusi dan intensitas data melalui kedalaman warna dalam matriks dua dimensi.

Skenario yang berlaku:

- Menampilkan kepadatan dan intensitas data dua dimensi berskala besar

- Analisis keterkaitan antara kategori dan nilai numerik

- Perbandingan silang antara deret waktu dan kategori

Warning

Kebutuhan data:

- Setidaknya 2 field dimensi untuk menentukan baris dan kolom heatmap

- Setidaknya 1 field numerik (metrik), digunakan untuk memetakan kedalaman warna

- Ketika beberapa metrik didukung, biasanya satu metrik dipilih untuk pemetaan warna

Fitur yang aktif secara default:

- Legenda, sumbu, label data, tooltip, dan penskalaan numerik aktif secara default

chartType

Type: "heatmap"

Deskripsi

Heatmap

Heatmap menampilkan distribusi dan intensitas data melalui kedalaman warna dalam matriks dua dimensi.

Contoh 'heatmap'

dataset

Type: Record[]

Deskripsi

Dataset

Dataset yang telah diagregasi dan sesuai spesifikasi TidyData, digunakan untuk menentukan sumber serta struktur data diagram. Dataset masukan pengguna tidak perlu diproses lagi; VSeed memiliki kemampuan reshape data yang kuat dan akan melakukan reshape secara otomatis. Data heatmap akhirnya dikonversi menjadi 2 dimensi dan 1 metrik.

Contoh [{month:'Jan', value:100}, {month:'Feb', value:150}, {month:'Mar', value:120}]

dimensions

Type: HeatmapDimension[] | undefined

Deskripsi

Dimensi

Pada heatmap, dimensi pertama dipetakan ke sumbu sudut; dimensi lainnya digabungkan dengan nama metrik (jika ada beberapa metrik) dan ditampilkan sebagai item legenda.

Contoh [{id: 'category', alias: 'Kategori'}]

id

Type: string

Deskripsi

ID field yang sesuai dengan dimensi

alias

Type: string | undefined

Deskripsi

Alias dimensi

timeFormat

Type: TimeFormat | undefined

Deskripsi

Konfigurasi format tanggal dimensi

type

Type: "year" | "quarter" | "month" | "week" | "day" | "hour" | "minute" | "second"

Deskripsi

Granularitas waktu, menentukan presisi tampilan tanggal

encoding

Type: "xAxis" | "tooltip" | "label" | "row" | "column" | "yAxis" | undefined

Deskripsi

Kanal tempat dimensi dipetakan

- xAxis: mendukung pemetaan beberapa dimensi ke sumbu X

- yAxis: mendukung pemetaan beberapa dimensi ke sumbu Y

- tooltip: mendukung pemetaan beberapa dimensi ke kanal tooltip

- label: mendukung pemetaan beberapa dimensi ke kanal label

- row: mendukung pemetaan beberapa dimensi ke kanal baris

- column: mendukung pemetaan beberapa dimensi ke kanal kolom

measures

Type: HeatmapMeasure[] | undefined

Deskripsi

Metrik

Metrik pada heatmap otomatis digabungkan menjadi satu metrik dan dipetakan ke sumbu radius. Jika ada beberapa metrik, nama metrik akan digabungkan dengan dimensi lainnya dan ditampilkan sebagai item legenda.

Contoh [{id: 'value', alias: 'Nilai'}]

id

Type: string

Deskripsi

ID metrik, harus unik

alias

Type: string | undefined

Deskripsi

Alias metrik, boleh duplikat; jika tidak diatur, alias bernilai id

autoFormat

Type: boolean | undefined

Deskripsi

Pemformatan angka otomatis, aktif secara default, prioritas tertinggi

Saat autoFormat=true, konfigurasi ini menimpa semua konfigurasi numFormat

Jika aktif, label data diagram dan tooltip akan otomatis memilih format yang sesuai berdasarkan nilai metrik dan locale.

Aturan format: angka desimal dengan notasi ringkas aktif, minimum 0 digit desimal, maksimum 2 digit desimal, pembulatan otomatis, menggunakan implementasi Intl.NumberFormat browser.

Contoh:

- locale=zh-CN: 749740.264 → 74.45万

- locale=en-US: 749740.264 → 744.5K

numFormat

Type: NumFormat | undefined

Deskripsi

Pemformatan angka kustom untuk measure; otomatis diterapkan ke label dan tooltip.

Catatan: Untuk memakai format kustom, Anda harus menetapkan autoFormat=false secara eksplisit; jika tidak, autoFormat akan menimpa konfigurasi ini

type

Type: "number" | "percent" | "permille" | "scientific" | undefined

Deskripsi

Jenis format angka, mendukung: decimal, percent (%), permille (‰), notasi ilmiah

ratio

Type: number | undefined

Deskripsi

Rasio format angka, tidak boleh 0

Contoh - 100000 dikonversi menjadi 10万, ratio:10000, symbol:"万" - 100000 dikonversi menjadi 10K, ratio:1000, symbol:"K"

symbol

Type: string | undefined

Deskripsi

Simbol format angka, mis. %, ‰

Contoh - 100000 dikonversi menjadi 10万, ratio:10000, symbol:"万" - 100000 dikonversi menjadi 10K, ratio:1000, symbol:"K"

thousandSeparator

Type: boolean | undefined

Deskripsi

Thousands separator for numeric formatting

suffix

Type: string | undefined

Deskripsi

Sufiks format angka

prefix

Type: string | undefined

Deskripsi

Simbol format angka, mis. %, ‰

fractionDigits

Type: number | undefined

Deskripsi

Decimal places for numeric formatting, using the browser's Intl.NumberFormat minimumFractionDigits and maximumFractionDigits; lower priority than significantDigits.

Contoh - 1234.5678 dikonversi menjadi 1235, fractionDigits:0 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.6, fractionDigits:1 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.57, fractionDigits:2 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1230.568, fractionDigits:3 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.5678, fractionDigits:4 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.56780, fractionDigits:5 (roundingMode:halfCeil)

significantDigits

Type: number | undefined

Deskripsi

Significant digits for numeric formatting, using the browser's Intl.NumberFormat minimumSignificantDigits and maximumSignificantDigits; higher priority than fractionDigits.

Contoh - 1234.5678 dikonversi menjadi 1000, significantDigits:1 - 1234.5678 dikonversi menjadi 1200, significantDigits:2 - 1234.5678 dikonversi menjadi 1230, significantDigits:3 - 1234.5678 dikonversi menjadi 1234, significantDigits:4 - 1234.5678 dikonversi menjadi 1234.6, significantDigits:5 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.57, significantDigits:6 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.568, significantDigits:7 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.5678, significantDigits:8 (roundingMode:halfCeil)

roundingPriority

Type: "morePrecision" | "lessPrecision" | undefined

Deskripsi

Rounding priority when both significantDigits and fractionDigits are set; uses the browser's Intl.NumberFormat, following the same rules as Intl.NumberFormat's roundingPriority.

Contoh - 1234.5678 dikonversi menjadi 1230, significantDigits:3 (roundingPriority:lessPrecision) - 1234.5678 dikonversi menjadi 1234.5678, significantDigits:3 (roundingPriority:morePrecision)

roundingMode

Type: "floor" | "ceil" | "expand" | "trunc" | "halfCeil" | "halfFloor" | "halfExpand" | "halfTrunc" | "halfEven" | undefined

Deskripsi

Rounding mode for numeric formatting, using the browser's Intl.NumberFormat, following the same rules as Intl.NumberFormat's roundingMode.

format

Type: NumFormat | undefined

type

Type: "number" | "percent" | "permille" | "scientific" | undefined

Deskripsi

Jenis format angka, mendukung: decimal, percent (%), permille (‰), notasi ilmiah

ratio

Type: number | undefined

Deskripsi

Rasio format angka, tidak boleh 0

Contoh - 100000 dikonversi menjadi 10万, ratio:10000, symbol:"万" - 100000 dikonversi menjadi 10K, ratio:1000, symbol:"K"

symbol

Type: string | undefined

Deskripsi

Simbol format angka, mis. %, ‰

Contoh - 100000 dikonversi menjadi 10万, ratio:10000, symbol:"万" - 100000 dikonversi menjadi 10K, ratio:1000, symbol:"K"

thousandSeparator

Type: boolean | undefined

Deskripsi

Thousands separator for numeric formatting

suffix

Type: string | undefined

Deskripsi

Sufiks format angka

prefix

Type: string | undefined

Deskripsi

Simbol format angka, misalnya %, ‰

fractionDigits

Type: number | undefined

Deskripsi

Decimal places for numeric formatting, using the browser's Intl.NumberFormat minimumFractionDigits and maximumFractionDigits; lower priority than significantDigits.

Contoh - 1234.5678 dikonversi menjadi 1235, fractionDigits:0 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.6, fractionDigits:1 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.57, fractionDigits:2 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1230.568, fractionDigits:3 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.5678, fractionDigits:4 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.56780, fractionDigits:5 (roundingMode:halfCeil)

significantDigits

Type: number | undefined

Deskripsi

Significant digits for numeric formatting, using the browser's Intl.NumberFormat minimumSignificantDigits and maximumSignificantDigits; higher priority than fractionDigits.

Contoh - 1234.5678 dikonversi menjadi 1000, significantDigits:1 - 1234.5678 dikonversi menjadi 1200, significantDigits:2 - 1234.5678 dikonversi menjadi 1230, significantDigits:3 - 1234.5678 dikonversi menjadi 1234, significantDigits:4 - 1234.5678 dikonversi menjadi 1234.6, significantDigits:5 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.57, significantDigits:6 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.568, significantDigits:7 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.5678, significantDigits:8 (roundingMode:halfCeil)

roundingPriority

Type: "morePrecision" | "lessPrecision" | undefined

Deskripsi

Rounding priority when both significantDigits and fractionDigits are set; uses the browser's Intl.NumberFormat, following the same rules as Intl.NumberFormat's roundingPriority.

Contoh - 1234.5678 dikonversi menjadi 1230, significantDigits:3 (roundingPriority:lessPrecision) - 1234.5678 dikonversi menjadi 1234.5678, significantDigits:3 (roundingPriority:morePrecision)

roundingMode

Type: "floor" | "ceil" | "expand" | "trunc" | "halfCeil" | "halfFloor" | "halfExpand" | "halfTrunc" | "halfEven" | undefined

Deskripsi

Rounding mode for numeric formatting, using the browser's Intl.NumberFormat, following the same rules as Intl.NumberFormat's roundingMode.

encoding

Type: "color" | "tooltip" | "label" | undefined

Deskripsi

Channel tempat metrik dipetakan

- color: metrik yang dipetakan ke kanal warna

- label: metrik yang dipetakan ke kanal label

- tooltip: metrik yang dipetakan ke kanal tooltip

parentId

Type: string | undefined

Deskripsi

Membangun grup metrik berbentuk tree dari konfigurasi metrik datar. parentId menunjuk ke id grup metrik induk dan digunakan untuk membangun tree metrik.

Tip

Ada dua cara mengonfigurasi pohon metrik: opsi 1 adalah langsung mengonfigurasi pohon metrik dengan children; opsi 2 adalah mengonfigurasi daftar metrik datar dengan parentId. Kedua cara ini tidak dapat digunakan bersamaan.

page

Type: Page | undefined

Deskripsi

Konfigurasi pagination

field

Type: string

Deskripsi

Field pagination; menentukan nama field untuk pagination dan harus berupa dimensi..

currentValue

Type: string

Deskripsi

Nilai pagination saat ini; menentukan nilai untuk menentukan halaman saat ini..

Contoh '2023-01-01'

backgroundColor

Type: BackgroundColor

Deskripsi

Warna latar belakang chart

Warna latar belakang dapat berupa string warna (mis. 'red', 'blue'), atau nilai hex, rgb, maupun rgba (mis. '#ff0000', 'rgba(255,0,0,0.5)')

color

Type: Color | undefined

Deskripsi

Color

Konfigurasi warna untuk menentukan skema warna chart, termasuk daftar warna, mapping warna, dan gradien warna.

colorScheme

Type: string[] | undefined

Deskripsi

Skema warna diskret untuk menentukan warna berbagai elemen dalam chart.

Contoh ['#FFCDD2,#F8BBD0,#E1BEE7,#D1C4E9,#C5CAE9,#BBDEFB,#B3E5FC,#B2EBF2,#B2DFDB,#C8E6C9,#DCEDC8,#F0F4C3,#FFF9C4,#FFECB3,#FFE0B2']

linearColorScheme

Type: string[] | undefined

Deskripsi

Skema warna gradien linear untuk menentukan warna berbagai elemen dalam chart.

Contoh ['#FFCDD2, #F8BBD0]

colorMapping

Type: Record<string, string> | undefined

Deskripsi

Mapping warna yang digunakan untuk memetakan nilai data ke warna tertentu.

Contoh { 'profit': 'red', 'sales': 'blue', }

positiveColor

Type: string | undefined

Deskripsi

Konfigurasi warna positif/negatif; menentukan warna untuk nilai positif di chart..

negativeColor

Type: string | undefined

Deskripsi

Konfigurasi warna positif/negatif; menentukan warna untuk nilai negatif di chart..

label

Type: Label | undefined

Deskripsi

Konfigurasi label heatmap, digunakan untuk mendefinisikan label data diagram. Inversi warna label otomatis aktif untuk memastikan keterbacaan.

enable

Type: false | true

Deskripsi

Apakah fungsi label diaktifkan..

wrap

Type: boolean | undefined

Deskripsi

Apakah label pindah ke baris berikutnya..

showValue

Type: boolean | undefined

Deskripsi

Apakah label menampilkan nilai metrik.

Dalam skenario multi-metrik, tidak perlu khawatir terjadi konflik nilai, karena semua metrik yang terkait dengan plot melewati proses foldMeasures dan digabung menjadi satu metrik yang mewakili satu titik data.

Catatan: label pada encoding memiliki prioritas lebih tinggi; konfigurasi ini tidak memengaruhi label pada encoding.

showValuePercent

Type: boolean | undefined

Deskripsi

Apakah label menampilkan persentase nilai metrik.

Dalam skenario multi-metrik, tidak perlu khawatir terjadi konflik nilai, karena semua metrik yang terkait dengan plot melewati proses foldMeasures dan digabung menjadi satu metrik yang mewakili satu titik data.

Catatan: label pada encoding memiliki prioritas lebih tinggi; konfigurasi ini tidak memengaruhi label pada encoding.

showDimension

Type: boolean | undefined

Deskripsi

Apakah label menampilkan label dimensi..

Displays all dimension labels.

Catatan: label pada encoding memiliki prioritas lebih tinggi; konfigurasi ini tidak memengaruhi label pada encoding.

autoFormat

Type: boolean | undefined

Deskripsi

Apakah nilai label diformat otomatis; saat autoFormat true, konfigurasi numFormat diabaikan..

numFormat

Type: NumFormat | undefined

Deskripsi

Konfigurasi format untuk nilai label; digabungkan dengan format di measure, dan format di measure memiliki prioritas lebih tinggi. numFormat memiliki prioritas lebih rendah daripada autoFormat.

type

Type: "number" | "percent" | "permille" | "scientific" | undefined

Deskripsi

Jenis format angka, mendukung: decimal, percent (%), permille (‰), notasi ilmiah

ratio

Type: number | undefined

Deskripsi

Rasio format angka, tidak boleh 0

Contoh - 100000 dikonversi menjadi 10万, ratio:10000, symbol:"万" - 100000 dikonversi menjadi 10K, ratio:1000, symbol:"K"

symbol

Type: string | undefined

Deskripsi

Simbol format angka, misalnya %, ‰

Contoh - 100000 dikonversi menjadi 10万, ratio:10000, symbol:"万" - 100000 dikonversi menjadi 10K, ratio:1000, symbol:"K"

thousandSeparator

Type: boolean | undefined

Deskripsi

Thousands separator for numeric formatting

suffix

Type: string | undefined

Deskripsi

Sufiks format angka

prefix

Type: string | undefined

Deskripsi

Simbol format angka, misalnya %, ‰

fractionDigits

Type: number | undefined

Deskripsi

Decimal places for numeric formatting, using the browser's Intl.NumberFormat minimumFractionDigits and maximumFractionDigits; lower priority than significantDigits.

Contoh - 1234.5678 dikonversi menjadi 1235, fractionDigits:0 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.6, fractionDigits:1 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.57, fractionDigits:2 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1230.568, fractionDigits:3 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.5678, fractionDigits:4 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.56780, fractionDigits:5 (roundingMode:halfCeil)

significantDigits

Type: number | undefined

Deskripsi

Significant digits for numeric formatting, using the browser's Intl.NumberFormat minimumSignificantDigits and maximumSignificantDigits; higher priority than fractionDigits.

Contoh - 1234.5678 dikonversi menjadi 1000, significantDigits:1 - 1234.5678 dikonversi menjadi 1200, significantDigits:2 - 1234.5678 dikonversi menjadi 1230, significantDigits:3 - 1234.5678 dikonversi menjadi 1234, significantDigits:4 - 1234.5678 dikonversi menjadi 1234.6, significantDigits:5 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.57, significantDigits:6 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.568, significantDigits:7 (roundingMode:halfCeil) - 1234.5678 dikonversi menjadi 1234.5678, significantDigits:8 (roundingMode:halfCeil)

roundingPriority

Type: "morePrecision" | "lessPrecision" | undefined

Deskripsi

Rounding priority when both significantDigits and fractionDigits are set; uses the browser's Intl.NumberFormat, following the same rules as Intl.NumberFormat's roundingPriority.

Contoh - 1234.5678 dikonversi menjadi 1230, significantDigits:3 (roundingPriority:lessPrecision) - 1234.5678 dikonversi menjadi 1234.5678, significantDigits:3 (roundingPriority:morePrecision)

roundingMode

Type: "floor" | "ceil" | "expand" | "trunc" | "halfCeil" | "halfFloor" | "halfExpand" | "halfTrunc" | "halfEven" | undefined

Deskripsi

Rounding mode for numeric formatting, using the browser's Intl.NumberFormat, following the same rules as Intl.NumberFormat's roundingMode.

labelFontSize

Type: number | undefined

Deskripsi

Ukuran font label

labelFontWeight

Type: string | number | undefined

Deskripsi

Ketebalan font label

labelBackgroundColor

Type: string | undefined

Deskripsi

Warna latar belakang label

labelStroke

Type: string | undefined

Deskripsi

Warna stroke label

labelColor

Type: string | undefined

Deskripsi

Warna font label

labelColorSmartInvert

Type: boolean | undefined

Deskripsi

Apakah warna font label otomatis dibalik berdasarkan warna elemen.

labelPosition

Type: "inside" | "outside" | undefined

Deskripsi

Posisi label

labelOverlap

Type: boolean | undefined

Deskripsi

Apakah penanganan tumpang tindih label diaktifkan.

selector

Type: Selector | Selectors | undefined

Deskripsi

Label selection; conditions between selectors default to OR.

field

Type: string

Deskripsi

Field dimensi; ID item dalam dimensions.

operator

Type: "in" | "not in" | undefined

Deskripsi

Operator

- in: Memilih item data yang nilai field dimensinya berada dalam daftar nilai.

- not in: Memilih item data yang nilai field dimensinya TIDAK berada dalam daftar nilai.

op

Type: "in" | "not in" | undefined

Deskripsi

Operator

- in: Memilih item data yang nilai field dimensinya berada dalam daftar nilai.

- not in: Memilih item data yang nilai field dimensinya TIDAK berada dalam daftar nilai.

sama dengan operator

value

Type: string | number | (string | number)[]

Deskripsi

Pilih nilai field dimensi; mendukung array

dynamicFilter

Type: ChartDynamicFilter | undefined

Deskripsi

Filter dinamis (eksekusi kode yang dihasilkan AI)

- in: Memilih item data ketika nilai field dimensi berada di dalam value

Core Capabilities:

- Mendukung kondisi filter data kompleks apa pun

- Menggunakan fungsi utilitas bawaan untuk operasi data

- Dieksekusi aman di lingkungan browser (sandbox Web Worker)

Environment Requirements: Supports browser environment only; Node.js environment will use fallback.

Catatan: selector dan dynamicFilter tidak dapat digunakan bersamaan; dynamicFilter memiliki prioritas lebih tinggi..

Konfigurasi filter dinamis chart.

Memfilter marker chart (bar, titik, dll.) melalui kode JavaScript yang dihasilkan AI.

type

Type: "row-with-field"

description

Type: string | undefined

Deskripsi

Deskripsi kebutuhan filter pengguna (bahasa alami).

Contoh - Supports any complex data filtering conditions

- Uses built-in utility functions for data operations

code

Type: string

Deskripsi

Kode filter JavaScript yang dihasilkan AI.

- Mendukung kondisi filter data kompleks apa pun

- Menggunakan fungsi utilitas bawaan untuk operasi data

- Dieksekusi aman di lingkungan browser (sandbox Web Worker)

- __row_index menunjukkan nomor baris item data asli, dan field menunjukkan field yang akan di-highlight.

- Dilarang: eval, Function, operasi asinkron, DOM API, permintaan jaringan.

Contoh return _.map(filtered, item => ({

const filtered = _.filter(data, item => item.sales > 1000);
return _.map(filtered, item => ({
__row_index: item.__row_index,
field: 'sales'
}));

const maxItems = _.map(grouped, group =>

const grouped = _.groupBy(data, 'area');
const maxItems = _.map(grouped, group =>
_.maxBy(group, item => item.profit / item.sales)
);
return _.flatten(
_.map(maxItems, item => [
{ __row_index: item.__row_index, field: 'product' },
{ __row_index: item.__row_index, field: 'profit' }
])
);

const profitRate = item.profit / item.sales;

const filtered = _.filter(data, item => {
const profitRate = item.profit / item.sales;
return profitRate > 0.2 && item.sales > 5000;
});
return _.flatten(
_.map(filtered, item => [
{ __row_index: item.__row_index, field: 'product' },
{ __row_index: item.__row_index, field: 'sales' }
])
);

fallback

Type: Selector | Selectors | undefined

Deskripsi

Fallback strategy when code execution fails or the environment is not supported.

field

Type: string

Deskripsi

Field dimensi; ID item dalam dimensions.

operator

Type: "in" | "not in" | undefined

Deskripsi

Operator

- in: Memilih item data yang nilai field dimensinya berada dalam daftar nilai.

- not in: Memilih item data yang nilai field dimensinya TIDAK berada dalam daftar nilai.

op

Type: "in" | "not in" | undefined

Deskripsi

Operator

- in: Memilih item data yang nilai field dimensinya berada dalam daftar nilai.

- not in: Memilih item data yang nilai field dimensinya TIDAK berada dalam daftar nilai.

sama dengan operator

value

Type: string | number | (string | number)[]

Deskripsi

Pilih nilai field dimensi; mendukung array

result

Type: DynamicFilterExecutionResult<RowWithFieldRes> | undefined

Deskripsi

Hasil eksekusi filter dinamis (field runtime)

Ditulis pada fase prepare(); hanya-baca saat runtime

success

Type: false | true

data

Type: T[] | undefined

error

Type: string | undefined

legend

Type: ColorLegend | undefined

Deskripsi

legend

Konfigurasi legenda warna heatmap, digunakan untuk mendefinisikan legenda chart, termasuk posisi, format, gaya, dan lainnya.

position

Type: "left" | "leftTop" | "leftBottom" | "lt" | "lb" | "top" | "topLeft" | "topRight" | "tl" | "tr" | "right" | "rightTop" | "rightBottom" | "rt" | "rb" | "bottom" | "bottomLeft" | "bottomRight" | "bl" | "br" | undefined

Deskripsi

Posisi legend

Contoh position: 'rightTop'

enable

Type: boolean | undefined

Deskripsi

Apakah fitur legend diaktifkan.

Contoh enable: true

labelColor

Type: string | undefined

Deskripsi

legend font color

labelFontColor

Type: string | undefined

Deskripsi

legend font color

labelFontSize

Type: number | undefined

Deskripsi

Ukuran font legenda.

Contoh labelFontSize: 10

labelFontWeight

Type: string | number | undefined

Deskripsi

Ketebalan font legenda.

Contoh labelFontWeight: 400

railBackgroundColor

Type: string | undefined

handlerBorderColor

Type: string | undefined

tooltip

Type: Tooltip | undefined

Deskripsi

Informasi tooltip

Konfigurasi tooltip heatmap, digunakan untuk mendefinisikan tooltip chart, termasuk posisi, format, gaya, dan lainnya.

enable

Type: false | true

Deskripsi

Apakah tooltip diaktifkan

brush

Type: Brush | undefined

Deskripsi

Menentukan bentuk dan arah kotak seleksi.

- polygon: seleksi poligonal, memungkinkan menggambar poligon bebas dengan mengklik beberapa titik

- y: Y-axis brush; selects only in the Y-axis direction, unrestricted on the X-axis.

enable

Type: boolean | undefined

Deskripsi

Define the style of data points that are selected.

brushType

Type: "rect" | "x" | "y" | "polygon" | undefined

Deskripsi

brushtype

Opacity

Opasitas titik data yang dipilih, rentang 0-1

- polygon: seleksi brush poligon; klik beberapa titik untuk menggambar poligon apa pun sebagai seleksi

- x: seleksi brush hanya dalam arah sumbu X; arah sumbu Y tidak dibatasi

- y: seleksi brush arah sumbu Y saja; arah sumbu X tidak dibatasi

brushMode

Type: "single" | "multiple" | undefined

Deskripsi

Opasitas titik data yang dipilih, rentang 0-1

Style for unselected data items

Menentukan style titik data di luar area brush yang dipilih

- multiple: mode multi-pilih; beberapa area brush dapat ada bersamaan

removeOnClick

Type: boolean | undefined

Deskripsi

Apakah area brush dibersihkan setelah brushing berakhir

inBrushStyle

Type: { opacity?: number; stroke?: string; lineWidth?: number; } | undefined

Deskripsi

Opasitas titik data yang tidak dipilih, rentang 0-1

Menentukan style titik data yang terkena brush

opacity

Type: number | undefined

Deskripsi

Style for data NOT selected by the brush.

Menentukan style titik data di luar seleksi.

stroke

Type: string | undefined

Deskripsi

Category axis (X-axis) configuration, used to define the chart's X-axis, including position, format, style, etc.

lineWidth

Type: number | undefined

Deskripsi

Lebar stroke

outOfBrushStyle

Type: { opacity?: number; stroke?: string; lineWidth?: number; } | undefined

Deskripsi

X-axis, category axis, X-axis configuration; defines the X-axis of the chart, including its position, format, style, etc.

Menentukan style titik data di luar brush selection

opacity

Type: number | undefined

Deskripsi

Style for data NOT selected by the brush.

Opasitas titik data di luar pilihan brush, rentang 0-1

stroke

Type: string | undefined

Deskripsi

Category axis (X-axis) configuration, used to define the chart's X-axis, including position, format, style, etc.

lineWidth

Type: number | undefined

Deskripsi

Lebar stroke

theme

Type: Theme | undefined

Deskripsi

Tema chart. Tema adalah konfigurasi fungsi berprioritas rendah yang mencakup konfigurasi umum untuk semua tipe chart dan konfigurasi chart bersama untuk satu tipe chart.

Tersedia dua tema bawaan, light dan dark. Pengguna dapat menyesuaikan tema melalui Builder.

const maxItems = _.map(grouped, group =>

_.map(maxItems, item => [

Contoh 'dark'

'light'

'customThemeName'

length

Type: number

brand

Type: brand

locale

Type: "zh-CN" | "en-US" | "ja-JP" | "de-DE" | "id-ID" | "fr-FR" | "ko-KR" | "vi-VN" | undefined

Deskripsi

language

Konfigurasi bahasa chart. Mendukung 'zh-CN' dan 'en-US'. Anda juga dapat memanggil intl.setLocale('zh-CN') untuk mengatur bahasa.