SVG Path: кривая, отходящая от прямой линии

Мне нужно нарисовать прямую линию (для разделения контента), а затем в конце начать кривую, которая соединяется с назначенной конечной точкой.

Моя проблема заключается в резком повороте, который он делает, когда начинает рисовать дугу после окончания прямой линии. Как убрать этот острый угол?

В качестве решения допустимо удлинение прямой, чтобы сгладить ее переход в кривую. Я просто не уверен, как это сделать программно, так как конечная точка будет периодически меняться, и она должна работать для всех вариантов использования.

Скрипка: (масштаб 1/5)

http://jsfiddle.net/7k2neef2/1/

Путь SVG:

M 56 494 l 324 0 A 100 100 0 0 0 231 275

Я должен отметить, что я использую функцию для получения дуги, а затем добавляю ее к прямой линии. Вот функция:

            function describeArc(x, y, radius, startAngle, endAngle){

                var arcSweep = endAngle - startAngle <= 180 ? "0" : "1";

                var d = [
                    "A", radius, radius, 0, arcSweep, 0, x, y
                ].join(" ");

                d = 'M 56 494 l 324 0 ' + d;

                return d;
            }