carlcraig / tc-angular-chartjs

AngularJS directives for Chart.js
http://carlcraig.github.io/tc-angular-chartjs/
Other
233 stars 83 forks source link

Graphs too wide in Bootstrap #45

Closed letterix closed 8 years ago

letterix commented 9 years ago

When I place a line chart inside a bootstrap panel body, the graph is 30 pixels too wide. It seems that the width calculation doesn't account for padding in the parent container (15px left, 15px right). This hack fixes it for me:

canvas {
    padding-right: 30px;
}

This is the html:

<div class="row">
    <div class="col-md-6">
        <div class="panel panel-default">
            <div class="panel-body">
                <canvas tc-chartjs chart-type="line" chart-data="data" chart-options="myOptions" auto-legend></canvas>
            </div>
        </div>
    </div>
</div>
SarasArya commented 8 years ago

I am facing the same issue...

carlcraig commented 8 years ago

I think this is most likely a chart.js issue.

If you are still facing this problem please look at opening an issue on chart.js https://github.com/chartjs/Chart.js/issues