private _updateElements()

in src/component/graphic/GraphicView.ts [111:275]
139 lines of code
35 McCabe index (conditional complexity)

    private _updateElements(graphicModel: GraphicComponentModel): void {
        const elOptionsToUpdate = graphicModel.useElOptionsToUpdate();

        if (!elOptionsToUpdate) {
            return;
        }

        const elMap = this._elMap;
        const rootGroup = this.group;

        const globalZ = graphicModel.get('z');
        const globalZLevel = graphicModel.get('zlevel');

        // Top-down tranverse to assign graphic settings to each elements.
        zrUtil.each(elOptionsToUpdate, function (elOption) {
            const id = modelUtil.convertOptionIdName(elOption.id, null);
            const elExisting = id != null ? elMap.get(id) : null;
            const parentId = modelUtil.convertOptionIdName(elOption.parentId, null);
            const targetElParent = (parentId != null ? elMap.get(parentId) : rootGroup) as graphicUtil.Group;

            const elType = elOption.type;
            const elOptionStyle = (elOption as GraphicComponentDisplayableOption).style;
            if (elType === 'text' && elOptionStyle) {
                // In top/bottom mode, textVerticalAlign should not be used, which cause
                // inaccurately locating.
                if (elOption.hv && elOption.hv[1]) {
                    (elOptionStyle as any).textVerticalAlign =
                        (elOptionStyle as any).textBaseline =
                        (elOptionStyle as TextStyleProps).verticalAlign =
                        (elOptionStyle as TextStyleProps).align = null;
                }
            }

            let textContentOption = (elOption as GraphicComponentZRPathOption).textContent;
            let textConfig = (elOption as GraphicComponentZRPathOption).textConfig;
            if (elOptionStyle
                && isEC4CompatibleStyle(elOptionStyle, elType, !!textConfig, !!textContentOption)) {
                const convertResult =
                    convertFromEC4CompatibleStyle(elOptionStyle, elType, true) as GraphicComponentZRPathOption;
                if (!textConfig && convertResult.textConfig) {
                    textConfig = (elOption as GraphicComponentZRPathOption).textConfig = convertResult.textConfig;
                }
                if (!textContentOption && convertResult.textContent) {
                    textContentOption = convertResult.textContent;
                }
            }

            // Remove unnecessary props to avoid potential problems.
            const elOptionCleaned = getCleanedElOption(elOption);


            // For simple, do not support parent change, otherwise reorder is needed.
            if (__DEV__) {
                elExisting && zrUtil.assert(
                    targetElParent === elExisting.parent,
                    'Changing parent is not supported.'
                );
            }

            const $action = elOption.$action || 'merge';
            const isMerge = $action === 'merge';
            const isReplace = $action === 'replace';
            if (isMerge) {
                const isInit = !elExisting;
                let el = elExisting;
                if (isInit) {
                    el = createEl(id, targetElParent, elOption.type, elMap);
                }
                else {
                    el && (inner(el).isNew = false);
                    // Stop and restore before update any other attributes.
                    stopPreviousKeyframeAnimationAndRestore(el);
                }
                if (el) {
                    applyUpdateTransition(
                        el,
                        elOptionCleaned,
                        graphicModel,
                        { isInit }
                    );
                    updateCommonAttrs(el, elOption, globalZ, globalZLevel);
                }
            }
            else if (isReplace) {
                removeEl(elExisting, elOption, elMap, graphicModel);
                const el = createEl(id, targetElParent, elOption.type, elMap);
                if (el) {
                    applyUpdateTransition(
                        el,
                        elOptionCleaned,
                        graphicModel,
                        { isInit: true}
                    );
                    updateCommonAttrs(el, elOption, globalZ, globalZLevel);
                }
            }
            else if ($action === 'remove') {
                updateLeaveTo(elExisting, elOption);
                removeEl(elExisting, elOption, elMap, graphicModel);
            }

            const el = elMap.get(id);

            if (el && textContentOption) {
                if (isMerge) {
                    const textContentExisting = el.getTextContent();
                    textContentExisting
                        ? textContentExisting.attr(textContentOption)
                        : el.setTextContent(new graphicUtil.Text(textContentOption));
                }
                else if (isReplace) {
                    el.setTextContent(new graphicUtil.Text(textContentOption));
                }
            }

            if (el) {
                const clipPathOption = elOption.clipPath;
                if (clipPathOption) {
                    const clipPathType = clipPathOption.type;
                    let clipPath: graphicUtil.Path;
                    let isInit = false;
                    if (isMerge) {
                        const oldClipPath = el.getClipPath();
                        isInit = !oldClipPath
                            || inner(oldClipPath).type !== clipPathType;
                        clipPath = isInit ? newEl(clipPathType) as graphicUtil.Path : oldClipPath;
                    }
                    else if (isReplace) {
                        isInit = true;
                        clipPath = newEl(clipPathType) as graphicUtil.Path;
                    }

                    el.setClipPath(clipPath);

                    applyUpdateTransition(
                        clipPath,
                        clipPathOption,
                        graphicModel,
                        { isInit}
                    );
                    applyKeyframeAnimation(
                        clipPath,
                        clipPathOption.keyframeAnimation,
                        graphicModel
                    );
                }

                const elInner = inner(el);

                el.setTextConfig(textConfig);

                elInner.option = elOption;
                setEventData(el, graphicModel, elOption);

                graphicUtil.setTooltipConfig({
                    el: el,
                    componentModel: graphicModel,
                    itemName: el.name,
                    itemTooltipOption: elOption.tooltip
                });

                applyKeyframeAnimation(el, elOption.keyframeAnimation, graphicModel);
            }
        });
    }