O'Reilly logo

Learning Highcharts by Joe Kuan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Expanding colors with gradients

Highcharts not only supports single color values, but also allows complex color gradient definitions. Highcharts supports linear gradient, which is a directional color shading as well as radial (or circular) gradient. In this section, we will experiment with linear gradient, and the radial gradient will be explored in Chapter 6, Gauge, Polar, and Range Charts. In Highcharts, the color gradient is based on the SVG linear color gradient standard, which is composed of two sets of information, as follows:

  • linearGradient: This gives a gradient direction for the color spectrum made up of two sets of x and y coordinates; ratio values are between 0 and 1, or in percentages
  • stops: This gives a sequence of colors to be filled ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required