GreenPSF Highcharts

by chetfarley

HTML

<script src="http://code.highcharts.com/stock/highstock.js"></script>
<script src="http://code.highcharts.com/stock/modules/exporting.js"></script>


<div id="container" style="height: 400px; min-width: 310px"></div>

JavaScript

$(function() {
	$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=usdeur.json&callback=?', function(data) {
		
 
 Highcharts.theme = {
   colors: ["#2ecc71", "#AAA", "#CCC"],
   chart: {
      backgroundColor: "#f3f3f3",
      borderWidth: 1,
      borderColor: "#CCC",
      borderRadius: 5
   },
   title: {
      style: {
         color: '#333',
         font: '18px "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif'
      }
   },
   subtitle: {
      style: {
         color: '#DDD',
         font: '14px "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif'
      }
   },
   xAxis: {
      gridLineWidth: 0,
      lineColor: '#999',
      tickColor: '#999',
      labels: {
         style: {
            color: '#999',
            fontWeight: 'bold'
         }
      },
      title: {
         style: {
            color: '#333',
            font: 'bold 14px "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif'
         }
      }
   },
   yAxis: {
      gridLineColor: '#ccc',
      lineWidth: 0,
      tickWidth: 0,
      labels: {
         style: {
            color: '#999',
            fontWeight: 'bold'
         }
      },
      title: {
         style: {
            color: '#333',
            font: 'bold 14px "Helvetica Neue",Helvetica,Arial,"Lucida Grande",sans-serif'
         }
      }
   },
   labels: {
      style: {
         color: '#333'
      }
   },
   tooltip: {
      backgroundColor: {
         linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
         stops: [
            [0, 'rgba(255, 255, 255, .9)'],
            [1, 'rgba(255, 255, 255, .9)']
         ]
      },
      borderWidth: 0,
      style: {
         color: '#333'
      }
   },
   navigation: {
      buttonOptions: {
         symbolStroke: '#666',
         hoverSymbolStroke: '#FFFFFF',
         theme: {
            fill: "#f3f3f3",
            stroke: '#666'
         }
      }
   },
            
   // scroll charts
   rangeSelector: {
      buttonTheme:...