реакция-svg-pan-zoom мерцание при перемещении или перетаскивании изображения SVG - PullRequest
Новая
       37

реакция-svg-pan-zoom мерцание при перемещении или перетаскивании изображения SVG

0 голосов
/ 05 июня 2019

Я использую response-svg-pan-zoom для создания изображения панорамирования svg, но при перетаскивании его мерцания возможно сделать движение svg более плавным или уменьшить скорость перетаскивания svg? Пожалуйста, помогите ...

Смотрите мой вывод здесь ... https://drive.google.com/open?id=1Jx4vhU62DqJzYsnW95fWQKjj75iwpDZ6

   <ReactSVGPanZoom
        ref={refs => {
          this.panZoom = refs;
        }}
        tool={TOOL_AUTO}
        toolbarPosition="none"
        background="transparent"
        width={window.innerWidth}
        height={this.state.height}
        // onClick={this.onClick}>

        scaleFactor={1.1}
        preventPanOutside={true}
        detectPinchGesture ={true}
        style={{ g: { transition: "all 0.5s linear 0s" } }}
        className={this.state.isTransition ? "pan-zoom" : ""}
        onPan={this.transitionOff}
        onZoom={this.transitionOff}
        //onMouseDown={this.onClick}

      >
        <svg id="root-svg" overflow="hidden">
          <g style={{ transition: "all 0.5s linear 0s" }}>
            {this.state.paths.map((path, index) => (
              <PathLine
                key={index}
                {...path}
                stroke="rgb(90, 86, 77)"
                strokeWidth="1"
                fill="none"
                r={10}
              />
            ))}
            {this.state.nodes.map(node => (
              <Node
                key={node.id}
                data={node}
                onClickNode={this.onClickNode}
                openAddModal={() => this.openAddModal(node)}
                onClickRemoveConnectedSibling={() =>
                  this.onClickRemoveConnectedSibling(
                    node.id,
                    node.connected_node_family_id
                  )
                }
                openAddProfileModal={this.openAddProfileModal}
                openAddAsSiblingModal={() =>
                  this.openAddAsSiblingModal(node)
                }
              />
            ))}
          </g>
        </svg>
      </ReactSVGPanZoom>
...