function GeneralFeature()

in captum/insights/attr_vis/frontend/src/components/Feature.tsx [100:146]


function GeneralFeature(props: GeneralFeatureProps) {
  const data = {
    labels: props.data.base,
    datasets: [
      {
        barPercentage: 0.5,
        data: props.data.modified,
        backgroundColor: (dataPoint: DataPoint) => {
          if (!dataPoint.dataset || !dataPoint.dataset.data || dataPoint.datasetIndex === undefined) {
            return "#d45c43"; // Default to red
          }
          const yValue = dataPoint.dataset.data[dataPoint.dataIndex as number] || 0;
          return yValue < 0 ? "#d45c43" : "#80aaff"; // Red if negative, else blue
        },
      },
    ],
  };

  return (
    <Bar
      data={data}
      width={300}
      height={50}
      legend={{ display: false }}
      options={{
        maintainAspectRatio: false,
        scales: {
          xAxes: [
            {
              gridLines: {
                display: false,
              },
            },
          ],
          yAxes: [
            {
              gridLines: {
                lineWidth: 0,
                zeroLineWidth: 1,
              },
            },
          ],
        },
      }}
    />
  );
}