Categories
JavaScript Answers

How to remove button from Highcharts and JavaScript?

Spread the love

Sometimes, we want to remove button from Highcharts and JavaScript.

In this article, we’ll look at how to remove button from Highcharts and JavaScript.

How to remove button from Highcharts and JavaScript?

To remove button from Highcharts and JavaScript, we can add new buttons.

For instance, we write

const chart = new Highcharts.Chart({
  chart: {
    renderTo: "container",
  },
  credits: {
    enabled: false,
  },
  xAxis: {
    categories: [
      "Jan",
      "Feb",
      "Mar",
      "Apr",
      "May",
      "Jun",
      "Jul",
      "Aug",
      "Sep",
      "Oct",
      "Nov",
      "Dec",
    ],
  },
  series: [
    {
      data: [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
    },
  ],
  exporting: {
    buttons: [
      {
        symbol: "diamond",
        x: -62,
        symbolFill: "#B5C9DF",
        hoverSymbolFill: "#779ABF",
        _titleKey: "printButtonTitle",
        onclick: () => {
          console.log("clicked");
        },
      },
    ],
  },
});

to add the exporting.buttons property to override the default buttons with our own button.

We set the fill with symbolFill and the fill on hover with hoverSymbolFill.

onclick is called when we click on the button.

Conclusion

To remove button from Highcharts and JavaScript, we can add new buttons.

Leave a Reply

Your email address will not be published.

If you like the content of this blog, subscribe to my email list to get exclusive articles not available to anyone else.