How to Put Caption Out of the Highcharts Chart

Asked

Viewed 563 times

1

Someoneinserir a descrição da imagem aqui you know how I put this caption out of my chart?

//Create the Chart

    Highcharts.stockChart('grafico_relatorio', {

            legend: {
                enabled: true
            },

            scrollbar: false,

            exporting: {

                filename: nome_da_exportacao,

                    chartOptions: {

                            legend: {
                                enabled: true
                            },
                            //inputEnabled: false
                            rangeSelector: false,
                            scrollbar: false,
                            navigator: false

                    }
            },

            rangeSelector: {
                selected: 5,

                buttons: [{

                    type: 'all',
                    text: 'Tudo'

                }, {

                    type: 'hour',
                    count: 1,
                    text: '1h'

                },{

                    type: 'hour',
                    count: 12,
                    text: '12h'

                },{

                    type: 'day',
                    count: 1,
                    text: '1d'

                },{

                    type: 'day',
                    count: 7,
                    text: '7d'

                },{

                    type: 'month',
                    count: 1,
                    text: '1m'

                }]
            },

            credits: {

                text: 'InMetrics',

                position: {

                    align: 'right',
                    x: 0,
                    y: 5
                },

                style: {
                    fontSize: '1em',
                }
            },

            chart: {
                type: 'line',
                zoomType: 'x'
            },

             tooltip: {
               shared: true
            },

            series: seriesOptions,

            yAxis: { //--- Primary yAxis
                title: {
                    text: metrica
                },
                labels: {
                    align: 'right'
                },
                gridLineColor: '#b1b7b0',
                gridLineWidth: 2
            }           

    });

inserir a descrição da imagem aqui

javascript highcharts

  • you want to put the bytes recived pro right side? what kind of chart is that? could add the source code that mounts it?

  • Hi my friend, I actually want to put the data (500, 400,300,200,100) out of the chart. it is mounted using the highcharts api (I will send the code that generates it)

2 answers

2


In the documentation you can make this modification with the following code snippet:

yAxis:{
    labels: {
        x:20
    }
}

Would look this way: 

yAxis: { //--- Primary yAxis
                title: {
                    text: metrica
                },
                labels: {
                    align: 'right',
                    x:20
                },
                gridLineColor: '#b1b7b0',
                gridLineWidth: 2
            }

References: Link, Link2

  • Jonathan thanks man, that’s just what I needed

0

Inside the Y-axis add property opposite: true this will affect the values and the legend on the left to the right side.

yAxis: {
        opposite: true,

        title: {text: metrica},
        labels: {align: 'right'},
        gridLineColor: '#b1b7b0',
        gridLineWidth: 2
}

  • Orra ! Yes, it was a pity that I still have no reputation!

  • @Juliohenrique97 soon you can increase the score, in which case you can mark as accepted (green light) the answer that solved your problem.

  • I just saw it, thanks! now I’m looking for how to set the width of the generated chart, because it is leaving the Labels out of the div, and then it does not appear on the screen

  • know how to set the width of the graph? I’ll post a photo to show you what happens

  • yes, because the div is independent (look at the image)

  • 2

    found! is margin right from Chart

Show 1 more comment

Browser other questions tagged javascript highcharts

You are not signed in. Login or sign up in order to post.