Change placement of "exporting" option

Question

I'd like to change the placement of the "exporting" buttons. In the moment they are positioned at the top right, and thus hiding pieces of a longer title. I'd like to change that, but don't see in the references a parameter for that.

Thanks for any hints!

Answer 1

There are many options to style buttons, you just have to take a look the reference.

Using exporting, you can directly style the button, like:

exporting: {
    buttons: {
        exportButton: {
            align: 'left',
            x: 40
        }
    }
}

demo

Using navigation you can style all buttons:

navigation: {
    buttonOptions: {
        align: 'center'
    }
}

demo

Reference:

• http://api.highcharts.com/highstock#exporting.buttons.exportButton

Answer 2

Ricardo's answer is almost correct. I believe the syntax has changed since he answered.

exporting button documentation

    exporting: {
        buttons: {
            contextButton: {
                align: 'left',
                x: 0,
                y: 380,
                verticalAlign: 'top'
            }
        }
    },

Answer 3

This works for me:

exporting: {
  buttons: {
    contextButton: {
      align: 'center',
      x: 50
    }
  }
},