Skip to content

Latest commit

 

History

History
67 lines (54 loc) · 2.09 KB

File metadata and controls

67 lines (54 loc) · 2.09 KB

bc-chart-parallel

Parallel coordinates chart (ECharts)

Quick Start

<bc-chart-parallel data='{"dimensions":["Price","Rating","Sales"],"data":[[100,4.5,200],[200,3.8,150],[150,4.2,300]]}' />

Props

Prop Type Default Description
data string (JSON) '[]' Chart data — {dimensions, data}
chart-title string '' Chart title
colors string (JSON) '' Color palette ["#4f46e5","#06b6d4"]
legend boolean true Show legend
tooltip-enabled boolean true Show tooltip
animate boolean true Enable animation
height string '300px' Chart height
width string '100%' Chart width
loading boolean false Show loading overlay
data-source string '' Remote data URL
fetch-headers string '' Custom fetch headers (JSON)
refresh-interval number 0 Auto-refresh interval (ms)
theme string '' ECharts theme ('dark' or custom JSON)
renderer string 'canvas' Renderer ('canvas' or 'svg')
toolbox boolean false Show toolbox (save, zoom, restore)
locale string '' ECharts locale

Data Format

{
  "dimensions": ["Price","Rating","Sales","Profit","Growth"],
  "data": [
    [100, 4.5, 200, 50, 10],
    [200, 3.8, 150, 30, 5],
    [150, 4.2, 300, 80, 15],
    [180, 4.0, 250, 60, 12]
  ]
}

Each row is one data line crossing all dimension axes.

Events

Event Payload
lcChartClick {name, value, dataIndex}
lcChartHover {name, value, dataIndex}
lcChartReady void

Methods

Method Returns Description
updateData(data) Promise Update chart data
setData(data) Promise Alias for updateData
refresh() Promise Re-fetch or re-render
resize() Promise Resize chart
exportImage(format?) Promise Export as image (png/jpeg/svg)
getChartInstance() Promise Get raw ECharts instance

See theming, data-fetching.