DefaultLegendContent

This component is by default rendered inside the Legend component. You would not use it directly.

You can use this component to customize the content of the legend, or you can provide your own completely independent content.

  • childrenReactNodeoptional

  • dangerouslySetInnerHTMLObjectoptional

  • formatterFormatteroptional

    Function to customize how content is serialized before rendering.

    This should return HTML elements, or strings.

    格式:

    (value, entry, index) => <span style={{ color: 'red' }}>{value}</span>
    https://codesandbox.io/s/legend-formatter-rmzp9
  • iconSizenumberoptional

    The size of icon in each legend item.

    默认值:14

  • iconType"circle" | "cross" | "diamond" | "line" | "none" | "plainline" | "rect" | "square" | "star" | "triangle" | "wye"optional

    The type of icon in each legend item.

  • inactiveColorstringoptional

    The color of the icon when the item is inactive.

    默认值:"#ccc"

  • labelStyleReact.CSSPropertiesoptional

    Style of individual items inside the Legend, a <span> element. These show the data label (name, or dataKey) and value.

    If a chart has multiple graphical items then the Legend renders multiple item and each of them gets this itemStyle applied.

    Pie charts render multiple labels from a single data series.

    Note that this is different from Tooltip:

    • in Tooltip: "labelStyle" styles the title / header
    • in Tooltip: "itemStyle" styles the individual data points
    • in Legend: "labelStyle" styles the individual data points

    Beware of the naming inconsistency!

    默认值:{}

  • layout"horizontal" | "vertical"optional

    The layout of legend items inside the legend container.

    默认值:"horizontal"

  • payloadArray<LegendPayload>optional

    DefaultLegendContent.payload is omitted from Legend props. A custom payload can be passed here if desired, or it can be passed from the Legend "content" callback.

    示例: