PhiaUi.Components.Data.ChartActiveShape (phia_ui v0.1.17)

Copy Markdown View Source

Hover-expanding shape component for chart elements.

Inspired by Recharts' activeShape — provides hover state transitions for dots, bars, and sectors using pure CSS :hover on SVG <g>.

Examples

<.chart_active_shape type={:dot} cx={100} cy={50} r={4} active_r={8} color="blue" />

<.chart_active_shape type={:bar} x={10} y={20} width={30} height={60} color="red" />

<.chart_active_shape type={:sector} path={normal_path} active_path={expanded_path} color="green" />

Summary

Functions

chart_active_shape(assigns)

Functions

chart_active_shape(assigns)

Attributes

  • type (:atom) - Shape type. Defaults to :dot. Must be one of :dot, :bar, or :sector.
  • cx (:any) - Circle center X. Defaults to 0.
  • cy (:any) - Circle center Y. Defaults to 0.
  • r (:any) - Normal radius. Defaults to 4.
  • active_r (:any) - Hover radius. Defaults to 8.
  • x (:any) - Bar X position. Defaults to 0.
  • y (:any) - Bar Y position. Defaults to 0.
  • width (:any) - Bar width. Defaults to 0.
  • height (:any) - Bar height. Defaults to 0.
  • path (:string) - Normal sector SVG path. Defaults to nil.
  • active_path (:string) - Expanded sector SVG path for hover. Defaults to nil.
  • color (:string) - Fill color. Defaults to "currentColor".
  • active_color (:string) - Hover fill color override. Defaults to nil.
  • opacity (:any) - Normal opacity. Defaults to 1.
  • active_opacity (:any) - Hover opacity. Defaults to 1.
  • class (:string) - Defaults to nil.
  • Global attributes are accepted.