Openlayers 4仅显示SVG图像的1/4

我试图在Openlayers 4.3.3中用SVG图标标记坐标：

import ControllerRecordIcon from '../icons/entypo/controller-record.svg';

vector.setStyle(new Style({
  image: new IconStyle({
    scale: 0.5,
    src: ControllerRecordIcon
  })
}));

map.addLayer(vector);

图标来自软件包，这是代码：

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Record" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 20 20" enable-background="new 0 0 20 20" xml:space="preserve">
<path d="M10,3c-3.866,0-7,3.133-7,7c0,3.865,3.134,7,7,7s7-3.135,7-7C17,6.133,13.866,3,10,3z"/>
</svg>

您可以在附加的图像中看到问题。只有图标左上角的四分之一可见，并且它不在坐标中心（红点标记坐标）。缩放并没有帮助，图标变小了，但仍然只显示图像的1/4，并且没有居中

我从中尝试了多个参数，但它们要么没有区别，要么图标完全消失

谢谢你，钱杜！现在我可以正确地看到图标了。另一个问题出现了——它现在不再停留在坐标上，而是随着缩放而移动：这是因为Openlayers功能/图标的配置不好还是其他原因？好的，我修复了它——entypo图标是20x20px，将代码更改为

width='20'height='20'

成功了吗