Highcharts Demo

author(s): Torstein Hønsi

by Black Label

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>

<div id="container"></div>

JavaScript

Highcharts.theme = {
  colors: ['#FF00B7', '#E10AAB',
    '#C3139E', '#410E78', '#721F87',
  ],
  chart: {
    spacing: 0,
    panning: {
      enabled: false
    },
    zooming: {
      mouseWheel: {
        enabled: false
      }
    },
    style: {
      fontFamily: 'Montserrat, sans-serif'
    }
  },
  credits: {
    enabled: false
  },
  title: {
    style: {
      fontWeight: 'bold',
      fontSize: 20,
      color: '#1B1534'
    }
  },
  legend: {
    symbolRadius: 0,
    itemStyle: {
      fontSize: 14,
      fontWeight: 'bold',
      color: '#1B1534'
    }
  },
  plotOptions: {
    series: {
      legendSymbol: 'rectangle'
    },
    timeline: {
      marker: {
        symbol: 'circle'
      },
      dataLabels: {
        enabled: false
      }
    },
    spline: {
      marker: {
        enabled: false
      }
    },
    flags: {
      color: '#721F87',
      fillColor: '#721F87',
      shape: 'squarepin',
      crisp: true,
      style: {
        color: 'white'
      }
    }
  },
  xAxis: {
    maxPadding: 0.08,
    lineWidth: 0,
    title: {
      style: {
        fontSize: 14,
        fontWeight: 'bold',
        color: '#1B1534'
      }
    },
    labels: {
      style: {
        fontSize: 14,
        fontWeight: 'bold',
        color: '#1B1534'
      }
    }
  },
  yAxis: {
    showLastLabel: false,
    gridLineWidth: 4,
    gridLineColor: 'white',
    labels: {
      style: {
        fontSize: 14,
        fontWeight: 'bold',
        color: '#1B1534'
      }
    },
    title: {
      style: {
        fontSize: 14,
        fontWeight: 'bold',
        color: '#1B1534'
      }
    }
  },
  responsive: {
    rules: [{
      condition: {
        maxWidth: 702
      },
      chartOptions: {
        yAxis: [{
            labels: {
              style: {
                fontSize: 12
              }
            },
            title: {
              style: {
                fontSize: 12
              }
            }
          },
          {
           ...