Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.

Menggunakan Highcharts

Gunakan visual Highcharts untuk membuat jenis grafik kustom dan visual yang menggunakan library Highcharts Core. Visual Highcharts memberikan akses langsung kepada penulis Quick Suite ke Highcharts API.

Untuk mengonfigurasi visual Highcharts, penulis Quick Suite perlu menambahkan skema Highcharts JSON ke visual di Quick Suite. Penulis dapat menggunakan ekspresi Quick Suite untuk mereferensikan bidang Quick Suite, dan opsi pemformatan dalam skema JSON yang mereka gunakan untuk menghasilkan visual Highcharts. Editor kode Bagan JSON memberikan bantuan kontekstual untuk pelengkapan otomatis dan validasi waktu nyata untuk memastikan bahwa skema JSON input dikonfigurasi dengan benar. Untuk menjaga keamanan, editor visual Highcharts tidak menerima CSS, JavaScript, atau input kode HTML.

Untuk informasi selengkapnya tentang visual Highcharts di Amazon Quick Suite, lihat Panduan Visual QuickStart Highcharts di. DemoCentral

Gambar berikut menunjukkan bagan lipstik yang dikonfigurasi dalam editor JSON kode Chart dari visual Highcharts di Quick Suite.

Untuk contoh visual lainnya yang dapat Anda buat dengan visual Highcharts di Quick Suite, lihat demo Highcharts.

Pertimbangan-pertimbangan

Sebelum Anda mulai membuat visual Highcharts di Amazon Quick Suite, tinjau batasan berikut yang berlaku untuk visual Highcharts.

Membuat visual Highcharts

Gunakan prosedur berikut untuk membuat visual Highcharts di Amazon Quick Suite.

Saat Anda puas dengan visual yang dirender, tutup panel properti. Untuk informasi selengkapnya tentang ekspresi spesifik Quick Sight yang dapat digunakan untuk mengonfigurasi visual Highcharts, lihatBahasa ekspresi Amazon Quick Suite JSON untuk visual Highcharts.

Fitur Highchart interaktif

Visualisasi Highchart di Amazon Quick Sight mendukung tindakan kustom, penyorotan, dan konsistensi warna bidang khusus, memungkinkan Anda membuat bagan interaktif dan kohesif visual yang terintegrasi secara mulus dengan visual Quick Sight lainnya.

Tindakan kustom

Dengan tindakan kustom, Anda dapat menentukan perilaku tertentu untuk setiap titik data dalam visualisasi Highchart Anda. Fitur ini terintegrasi secara mulus dengan kerangka kerja tindakan Quick Sight yang ada, memungkinkan Anda membuat bagan interaktif yang merespons klik pengguna. Sistem saat ini mendukung pemilihan titik data tunggal, memberi Anda kontrol yang tepat atas interaksi pengguna. Tindakan khusus dapat diimplementasikan di berbagai jenis bagan, termasuk grafik garis, diagram batang, dan bagan batang bertumpuk, antara lain.

Untuk menerapkan tindakan kustom, Anda harus memodifikasi konfigurasi Highcharts JSON Anda. Tambahkan blok acara ke konfigurasi seri Anda, tentukan peristiwa klik dan tindakan yang sesuai. Contoh:

{
  "series": [{
    "type": "line",
    "data": ["getColumn", 1],
    "name": "value",
    "events": {
      "click": [
        "triggerClick", { "rowIndex": "point.index" }
      ]
    }
}]

Konfigurasi ini memungkinkan peristiwa klik pada titik data bagan Anda, memungkinkan Quick Sight untuk menangani tindakan kustom berdasarkan data yang dipilih.

Penyorotan lintas visual

Penyorotan lintas visual meningkatkan interaktivitas dasbor Anda dengan membuat koneksi visual antara bagan yang berbeda. Ketika pengguna memilih elemen dalam satu bagan, elemen terkait dalam visual lain secara otomatis disorot, sementara elemen yang tidak terkait diredupkan. Fitur ini membantu pengguna dengan cepat mengidentifikasi hubungan dan pola di berbagai visualisasi, meningkatkan pemahaman dan analisis data.

Untuk mengaktifkan penyorotan lintas visual dan mempertahankan konsistensi warna bidang, gunakan quicksight klausa dalam konfigurasi Highcharts JSON Anda. Klausa ini bertindak sebagai jembatan antara rendering Highcharts dan sistem interaksi visual Quick Suite. Berikut adalah contoh cara mengaturnya:

{
  "quicksight": {
    "pointRender": ["updatePointAttributes", {
      "opacity": ["case", 
        ["dataMarkMatch", ["getColumnName", 0], "series.name"],
        1,  // Full opacity for matching elements
        0.1 // Dim non-matching elements
      ],
      "color": ["getColumnColorOverrides", ["getColumnName", 0], "series.name"]
    }]
  }
}

Konfigurasi ini menggunakan bahasa ekspresi JSON Quick Sight untuk memodifikasi properti visual secara dinamis seperti opacity dan color berdasarkan interaksi pengguna dan skema warna yang telah ditentukan sebelumnya.

Untuk skenario yang lebih kompleks, Anda dapat mengatur penyorotan berdasarkan beberapa kondisi. Ini memungkinkan interaktivitas yang lebih bernuansa dalam visualisasi Anda. Contoh berikut menyoroti elemen berdasarkan kuartal atau hari dalam seminggu:

{
  "quicksight": {
    "pointRender": ["updatePointAttributes", {
      "opacity": ["case",
        ["||",
          ["dataMarkMatch", "quarter", "series.name"],
          ["dataMarkMatch", "day_of_week", "point.name"]
        ],
        1,  // Full opacity for matching elements
        0.1 // Dim non-matching elements
      ],
    }]
  }
}

Konsistensi warna tingkat lapangan

Mempertahankan koherensi visual di seluruh dasbor Anda sangat penting untuk interpretasi data yang efektif. Fitur konsistensi warna tingkat lapangan memastikan bahwa warna yang ditetapkan ke dimensi tertentu berbeda di semua visual di dasbor Anda. Konsistensi ini membantu pengguna dengan cepat mengenali dan melacak kategori data tertentu di berbagai jenis dan tampilan bagan, meningkatkan pengalaman pengguna dan pemahaman data secara keseluruhan.