Как сделать border-radius наоборот?
upd
Если нужна юзабельность карты только внутри круга, то в голову приходит только svg 
codepen.io/iiil/pen/JpBaE
Зато заметьте, как работает отлично, карта работает только в области круга (а не приямоугольника), за счет все того же pointer-events: none;который, как говорят, и был придуман в свое время для svg.
Кроме того, Вы можете сделать более сложный svg, к примеру, чтобы был доступ до объектов управления картой — вырезать окна для них.
codepen.io/iiil/pen/Bwhjq
С картой надо будет работать? Тогда как вариант: pointer-events: none;
Саму маску с помощью бордеров, или как тут указывали — с помощью радиального градиента и псевдообластей.
P.S. Учитывая несколько предложенных абсолютно разных вариантов — из Вашего рисунка все-таки не все понятно )
https://developer.mozilla.org/en-US/docs/Web/CSS/r...
Хотя проще наверное через svg