Neighbourhood Party Manager

    highcharts-border-radius

    0.0.4 • Public • Published

    Highchart Border Radius

    npm Version

    Installation

    npm install highcharts-border-radius

    Usage

    The plugin adds options for individual border radius to a highchart column chart.

    • borderRadiusTopLeft
    • borderRadiusTopRight
    • borderRadiusBottomLeft
    • borderRadiusBottomRight

    Column Example

    const borderRadius = require("highcharts-border-radius");
    borderRadius(Highcharts);
     
    Highcharts.chart(".container", {
      chart: { type: "column" },
      title: { text: "Highcharts Border Radius" },
      xAxis: {
        categories: [
          "Jan",
          "Feb",
          "Mar",
          "Apr",
          "May",
          "Jun",
          "Jul",
          "Aug",
          "Sep",
          "Oct",
          "Nov",
          "Dec",
        ],
      },
      yAxis: {
        min: 0,
        title: {
          text: "Example",
        },
      },
      plotOptions: {
        column: {
          borderRadiusTopLeft: 5,
          borderRadiusTopRight: 5,
        },
      },
      series: [
        {
          name: "Series 1",
          data: [1, 5, 9, 2, 4, 5, 7, 6],
        },
        {
          name: "Series 2",
          data: [8, 4, 6, 7, 1, 5, 4, 8],
        },
        {
          name: "Series 3",
          data: [9, 6, 7, 2, 6, 4, 7, 1],
        },
      ],
    });

    Bar Example

    const borderRadius = require("highcharts-border-radius");
    borderRadius(Highcharts);
     
    Highcharts.chart(".container", {
      chart: { type: "bar" },
      title: { text: "Highcharts Border Radius" },
      xAxis: {
        categories: [
          "Jan",
          "Feb",
          "Mar",
          "Apr",
          "May",
          "Jun",
          "Jul",
          "Aug",
          "Sep",
          "Oct",
          "Nov",
          "Dec",
        ],
      },
      yAxis: {
        min: 0,
        title: {
          text: "Example",
        },
      },
      plotOptions: {
        bar: {
          borderRadiusTopLeft: 5,
          borderRadiusTopRight: 5,
        },
      },
      series: [
        {
          name: "Series 1",
          data: [1, 5, 9, 2, 4, 5, 7, 6],
        },
        {
          name: "Series 2",
          data: [8, 4, 6, 7, 1, 5, 4, 8],
        },
        {
          name: "Series 3",
          data: [9, 6, 7, 2, 6, 4, 7, 1],
        },
      ],
    });

    Keywords

    none

    Install

    npm i highcharts-border-radius

    DownloadsWeekly Downloads

    3,796

    Version

    0.0.4

    License

    MIT

    Unpacked Size

    7.42 kB

    Total Files

    5

    Last publish

    Collaborators

    • bellstrand