css - Webkit のような丸みを帯びた境界線を描画するための数式

Question

キャンバスでは、webkit ベース (Google Chrome) ブラウザーと同じ方法で角を丸くしたいと考えています。たとえば、css では、次のように div を定義できます。

div {
  background-color: red;
  width: 100px;
  height: 100px;
  margin: 20px;
  border-radius: 30px;
  border-top: 5px solid blue;
  border-left: 20px solid green;
}

実際の例はこちら: http://jsfiddle.net/fHmt9/

キャンバスでこの例から緑の境界線を描くにはどうすればよいですか? これの数学公式は何ですか？