Monochrome polar area

Shades of one colour.

Chart type
Polar Area polarArea
Tier
Free Core
Collection
Polar area
Render
Live, site theme
View .md Agent setup
LIVE/polar-area/polar-area-monochrome2 of 2 in Polar area

Configuration

Raw Standalone
const options = {
  chart: {
    height: 400,
    fontFamily: "Inter, Geist, \"IBM Plex Sans\", system-ui, sans-serif",
    type: "polarArea",
    toolbar: {
      show: false
    }
  },
  series: [42, 37, 29, 21, 15],
  labels: ["North", "South", "East", "West", "Central"],
  theme: {
    mode: "light",
    preset: "coastal",
    monochrome: {
      enabled: true,
      color: "#7c3aed",
      shadeTo: "light",
      shadeIntensity: 0.6
    }
  },
  yaxis: {
    show: false
  },
  plotOptions: {
    polarArea: {
      rings: {
        strokeWidth: 0
      },
      spokes: {
        strokeWidth: 0
      }
    }
  }
}

const chart = new WestCoastCharts(document.querySelector('#chart'), options)
chart.render()