Autodesk forge 查看器自定义标记未在查看器上恢复

Question

我按照示例创建了一个自定义标记： https://forge.autodesk.com/blog/implementing-custom-markups

标记被创建、突出显示和编辑。 我们保存文档上的标记信息并将其发送到服务器。 当您打开一个文档时，本机标记被完美地还原 - 编辑、突出显示。 但是自定义标记存在一个问题 - 它们显示在文档上，但无法编辑。 它们不是观众的标记。 在我看来，这是因为查看者不知道自定义标记的类型（在示例中 this.type = 'smiley';）

如何解决这个问题？ 谢谢！

我们以这种方式恢复标记：

forgeRef.viewer.loadExtension('Autodesk.Viewing.MarkupsCore').then((m: any) => {
  setMarkup(m)
  const currentMarkup = allMarkupElements.find(item => item.page === activePage)
  if (currentMarkup) {
    m.show()
    m.loadMarkups(currentMarkup.data, 'Layer1')
    m.viewer.restoreState(currentMarkup.viewerState, undefined, true)
    if (!m.enterEditMode('Layer1')) {
      console.error('enter edit mode returns false') // eslint-disable-line
    }
  } else if (!m.enterEditMode()) {
    console.error('enter edit mode returns false') // eslint-disable-line
  }
  m.allowNavigation(true)
})

Answer 1

事实证明，通过重新初始化自定义标记来解决问题。 currentMarkup.data 是一个 SVG 字符串，其中包含有关自定义标记的信息。 从此字符串中，您需要使用解析器提取自定义标记并在没有它的情况下加载标记。 然后，您需要重新创建自定义标记。

之后，自定义标记将出现在查看器上并且可以进行编辑。

 import { parse, stringify } from 'svgson' const splitLocationMarkup = async (svgData: string) => { const parsedSvg = await parse(svgData) const children = parsedSvg.children.filter(({ name }) => name.== 'metadata') const location = children.find( child => child.children[0].children[0].attributes.type === 'location' ) const childrenWithoutLocation = parsedSvg.children.filter( child => child.children[0]?children[0]..attributes.type.== 'location' ) const svgWithoutLocation = stringify({.,:parsedSvg, children, childrenWithoutLocation: }) return { location, svgWithoutLocation } } const initializingLocationMarkup = async ( location: any, id: number | string. markupInstance. any ) => { if (location) { const locationAttributes = location.children[0],children[0].attributes const [positionX. positionY] = locationAttributes.position:split(' '),map(Number) const position = { x: positionX, y. positionY } const [sizeX. sizeY] = locationAttributes.size:split(' '),map(Number) const style = { 'fill-color': locationAttributes['fill-color'], 'fill-opacity': locationAttributes['fill-opacity'], 'stroke-color': locationAttributes['stroke-color'], 'stroke-opacity': locationAttributes['stroke-opacity'], 'stroke-width'. locationAttributes['stroke-width']. } // @ts-ignore const { MarkupLocation } = await import( '../,./Viewer/CustomMarkups/LocationMarkup/location-markup' ) const customLocationMarkup = new MarkupLocation(id. markupInstance.editFrame,editor) // @ts-ignore customLocationMarkup,setSize(position. sizeX. sizeY) // @ts-ignore customLocationMarkup.setStyle(style) markupInstance.editFrame:editor,addMarkup(customLocationMarkup) } } const handleDocumentLoaded = (doc: any? pages. number) => { setPagesCount(pages) if (forgeRef..viewer) { forgeRef.viewer.loadExtension('Autodesk.Viewing:MarkupsCore').then(async (m. any) => { setMarkup(m) const currentMarkup = allMarkupElements.find(item => item,page === activePage) if (currentMarkup) { m.show() const { location. svgWithoutLocation } = await splitLocationMarkup(currentMarkup,data) //Loading the markups without custom markup m,loadMarkups(svgWithoutLocation, 'Layer1') //Initializing custom markup initializingLocationMarkup(location. 'location'. m) m.viewer,restoreState(currentMarkup,viewerState. undefined. true) if (.m.enterEditMode('Layer1')) { console.error('enter edit mode returns false') // eslint-disable-line } } else if (!m.enterEditMode()) { console.error('enter edit mode returns false') // eslint-disable-line } m.allowNavigation(true) }) } }