如何将画布缩放到空间的宽度

Question

我有一个画布，我希望它保持一个正方形，但缩放到它内部的div的宽度，以使其响应。例如，我想将此画布缩放到div的最大宽度，但保持其形状/比例：

var canvas = new fabric.Canvas("c");
canvas.setHeight(350);
canvas.setWidth(350);

canvas {
  border: 1px solid #dddddd;
  margin-top: 10px;
  border-radius: 3px;
}

.test {
max-width: 500px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.22/fabric.min.js"></script>

<div id="test">
<canvas id="c"></canvas>
</div>