add a padding to the plot area in HighStock to pad the border? - Javascript highcharts

Javascript examples for highcharts:Stock Chart

Description

add a padding to the plot area in HighStock to pad the border?

Demo Code

ResultView the demo in separate window

<html>
   <head> 
      <title>Highcharts Stock Demo</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
   </head> 
   <body> 
      <div id="container" style="height: 400px; min-width: 600px"></div> 
      <script src="https://code.highcharts.com/stock/highstock.js"></script> 
      <script src="https://code.highcharts.com/stock/modules/exporting.js"></script> 
      <script type="text/javascript" src="https://www.highcharts.com/samples/data/usdeur.js"></script> 
      <script type="text/javascript">
Highcharts.stockChart('container', {
chart: {//from w w  w.  j a  va2 s . com
        spacingBottom: 15,
        spacingTop: 15,
        spacingLeft: 15,
        spacingRight: 15,
},
    rangeSelector: {
          buttonSpacing: 15,
        buttonTheme: { // styles for the buttons
              padding:15,
            fill: 'none',
            stroke: 'none',
            'stroke-width': 0,
            r: 0,
            style: {
                color: '#039',
                fontWeight: 'bold'
            },
            states: {
                hover: {
                },
                select: {
                    fill: '#039',
                    style: {
                        color: 'white'
                    }
                }
            }
        },
        inputBoxBorderColor: 'gray',
        inputBoxWidth: 120,
        inputBoxHeight: 18,
        inputStyle: {
            color: '#039',
            fontWeight: 'bold'
        },
        labelStyle: {
            color: 'silver',
            fontWeight: 'bold'
        },
        selected: 1
    },
    series: [{
        name: 'USD to EUR',
        data: usdeur
    }]
});

      </script>  
   </body>
</html>

Related Tutorials