How to remove highcharts.com credits link

Highcharts is a popular JavaScript charting library that offers a wide range of interactive and customizable charts for developers. However, if you’re using the free version of Highcharts, you may have noticed a “Highcharts.com” credit link at the bottom of your charts. While this is a small price to pay for using a powerful tool like Highcharts for free, it may not be desirable for some applications.

Fortunately, removing the Highcharts credit link is a relatively simple process that can be accomplished with just a few lines of code. Here’s how to do it:

Step 1: Check your license

Before you start removing the credit link, it’s important to make sure you’re not violating the Highcharts license agreement. If you’re using the free version of Highcharts, you must keep the credit link intact. If you want to remove it, you’ll need to purchase a commercial license. You can check your license by looking at the Highcharts.js file you’re using. If the license key is missing or set to “undefined”, it means you’re using the free version.

Step 2: Remove the credit link

If you have a commercial license or you’re using the free version of Highcharts for non-commercial purposes, you can remove the credit link by adding a single line of code to your JavaScript file:

Highcharts.setOptions({
    credits: {
        enabled: false
    }
});

This code disables the Highcharts credit link for all charts on the page. Simply include it in your JavaScript file after you’ve loaded the Highcharts library, and the credit link will disappear.

If you only want to remove the credit link for a specific chart, you can add the “credits” option to your chart configuration and set “enabled” to false:

var chart = Highcharts.chart('container', {
    credits: {
        enabled: false
    },
    // chart configuration options
});

This will remove the credit link for just that specific chart.

Step 3: Customize the credit text

If you’re using a commercial license, you can customize the text of the credit link to display your own branding or messaging. To do this, simply add the “text” option to your “credits” configuration:

Highcharts.setOptions({
    credits: {
        text: 'My Custom Text',
        href: 'http://www.mycustomurl.com'
    }
});

This code sets the credit link text to “My Custom Text” and sets the link destination to "http://www.mycustomurl.com". You can customize the text and URL to suit your needs.

Conclusion

Removing the Highcharts credit link is a simple process that can be accomplished with just a few lines of code. However, it’s important to make sure you’re not violating the license agreement before doing so. If you’re using the free version of Highcharts, you must keep the credit link intact. If you have a commercial license or you’re using the free version for non-commercial purposes, you can remove the credit link or customize it to display your own branding. With these steps, you can ensure that your charts look professional and reflect your own brand.

Photo from Unsplash

Related Posts

How to Capture Screenshots with Puppeteer In NodeJS

How to Capture Screenshots with Puppeteer In NodeJS

To Capture Screenshots with Puppeteer: Launch a Browser Instance Navigate to the Web Page Capture the Screenshot Introduction: Puppeteer is a powerful Node.js library that allows developers…

How to Minimize Puppeteer Browser Window To Tray

How to Minimize Puppeteer Browser Window To Tray

Puppeteer is a powerful tool for automating tasks in headless or non-headless web browsers using JavaScript. While Puppeteer is often used to perform actions within a browser,…

Intercepting Responses in Node.js with Puppeteer

Intercepting Responses in Node.js with Puppeteer

Introduction: Puppeteer is a powerful Node.js library that provides a high-level API for controlling headless Chrome or Chromium browsers. It’s widely used for web scraping, automated testing,…

Mastering React Component Re-rendering in Jest

Mastering React Component Re-rendering in Jest

In this hands-on guide, we’ll explore the art of optimizing React component re-rendering within Jest tests. By combining theory with practical coding examples, you’ll gain a deep…

Eliminating Nesting Loops in React Rendering

Eliminating Nesting Loops in React Rendering

React has ushered in a new era of web application development with its component-based structure, promoting code reusability and maintainability. But as projects evolve, achieving optimal performance…

Exploring Type and Interface Usage in TypeScript

Exploring Type and Interface Usage in TypeScript

TypeScript has gained immense popularity by bridging the gap between dynamic JavaScript and static typing. Two of its fundamental features, “Type” and “Interface,” play pivotal roles in…

Leave a Reply

%d bloggers like this: