Skip to content

endShape prop does not work properly ArcherContainer #166

@pierpo

Description

@pierpo

The following code gives this

image

If we remove endShape=..., it gives this result instead:

image

import React from "react";
import logo from "./logo.svg";
import "./App.css";
import { ArcherContainer, ArcherElement } from "react-archer";

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <ArcherContainer
          strokeColor="yellow"
          endShape={{ circle: { radius: 2 } }}
        >
          <div style={{ display: "flex" }}>
            <ArcherElement id="first">
              <div>first</div>
            </ArcherElement>
            <ArcherElement
              id="second"
              relations={[
                {
                  targetId: "first",
                  targetAnchor: "right",
                  sourceAnchor: "left"
                }
              ]}
            >
              <div style={{ marginLeft: 100 }}>second</div>
            </ArcherElement>
          </div>
        </ArcherContainer>
      </header>
    </div>
  );
}

export default App;

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions