我正在尝试使用选择器插入另一个插入工具栏,问题是当我选择矩形或多边形时效果很好,我绘制它然后我可以看到要确认的小部件,但是当我选择时圆圈或日食,如果小部件修改了或者格式化程序也修改了,我什至看不到小部件,并且我在控制台中收到此错误:
`Uncaught TypeError: n.reduce is not a function
at _e (selector.js:1945:23)
at new u (selector.js:2373:15)
at a.createEditableShape (selector.js:2557:24)
at AnnotationLayer.js:436:48
at kS.emit (index.js:36:20)
at ToolsRegistry.js:57:46
at a.emit (selector.js:94:25)
at selector.js:2552:23
at i.mouseUp (selector.js:835:29)`
我以为我自己的格式化程序和我自己的小部件有问题,所以我使用了另一个插件的格式化程序ShapeLapel,但仍然是同样的问题, 这是代码:
<html>
<head>
<!-- Annotorious first -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@recogito/annotorious@latest/dist/annotorious.min.css">
</head>
<body>
<div id="my-toolbar-container"></div>
<img id="hallstatt" src="640px-Hallstatt.jpg">
<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious@latest/dist/annotorious.min.js"></script>
<script src="annotorious-shape-labels.min.js"></script>
<!-- Selector Pack plugin -->
<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious-toolbar@latest/dist/annotorious-toolbar.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@recogito/annotorious-selector-pack@latest/dist/annotorious-selector-pack.min.js"></script>
<script>
window.onload = function() {
// Init Annotorious
var anno = Annotorious.init({
image: 'hallstatt',
formatter: Annotorious.ShapeLabelsFormatter()
});
// Init the plugin
Annotorious.SelectorPack(anno);
Annotorious.Toolbar(anno, document.getElementById('my-toolbar-container'));
// [ 'rect', 'polygon', 'point', 'circle', 'ellipse', 'freehand' ]
console.log(anno.listDrawingTools());
}
</script>
</body>
</html>
我想我可能已经通过 Gitter 支持频道回答了这个问题。但对于后代:
由于当前 Annotorious 版本中的错误,
formatter
字段当前需要一个数组作为值。因此,您需要将初始化代码更改为:
var anno = Annotorious.init({
image: 'hallstatt',
formatter: [ Annotorious.ShapeLabelsFormatter() ]
});