将Plotly.js保留在卡中

Question

我使用plotly.js进行绘图，每次缩放屏幕时都会调整屏幕大小，该绘图也会调整大小，但是对于他的容器来说太大了。

我的代码的一部分（我删除了很多东西，其他痕迹，注释和形状）

<div class="row">
   <div class="col-md-6">
      <div class="card card-accent-danger">
         <div class="card-header">
               Explorer Plot #1
          </div>
      <div class='card-body'>
                <div id="myplot"></div>
      </div>
   </div>
</div>
<script>
$(document).ready( function () {

    $('#btn-plot').on('click', function(lvins) {
                var url = "{{ api_url }}values?token={{ api_token() }}";
        d3.json(url, function(error, data) {

var trace = {
            x: data['x'],
            autobinx: false,
            xbins: {
                start: min,
                size: 1,
                end: max
            },
            nbinx: data['xfit'].length,
            type: 'histogram',
          };
        var trace2 = {
            x: data['xfit'],
            y: data['yfit'],
            type: 'countour',
            line: {
                width: 3}
          };
var layout = {
            title: title,
            width: 650,
            height: 450,
            showlegend: true,
            }
        var plot = [trace, trace2];
        Plotly.newPlot('myplot', plot, layout});
        });
    });
</script>

这就是我得到的（我有两个地块，以相同的方式构造）