Делаем холст видимым из холста

Question

Можно ли визуализировать элемент canvas из собственной области?

В этом примере я рисую прямоугольник, координата x и координата y которого является отрицательным значением. Можно ли сделать весь прямоугольник? overflow правило здесь не работает.

jsfiddle

HTML

<div class="container">
  <div class="row">
    <div class="col">
      1 of 2
    </div>
    <div class="col main">
      <canvas id="example" width="150" height="150"></canvas>
    </div>
  </div> 
</div>

* Javascript 1016 *

var canvas = document.getElementById("example");
var ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.rect(-30, -30, 150, 100);
ctx.fillStyle = "red";
ctx.fill();

1020 * CSS *

.row {
  background: CornflowerBlue;
  margin-top: 20px;
}

.col {
  padding: 0 !important;
  border: solid 1px #6c757d;
  padding: 10px;
}

.main, canvas {
  overflow: visible;
}