Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Offset connector line and too short match boxes #72

Open
RooRoo6080 opened this issue Jun 22, 2024 · 2 comments
Open

Offset connector line and too short match boxes #72

RooRoo6080 opened this issue Jun 22, 2024 · 2 comments

Comments

@RooRoo6080
Copy link

The image in the readme looks great, but when I run it I see something like this:
image

To compare, what's on the demo looks like this:
image

How do I make the spacing and alignment look that good, and could those aesthetics be brought back into the current version?

@Shenato
Copy link
Contributor

Shenato commented Aug 9, 2024

I think you might be using incorrect data and that's why it looks the way it does. can you share the data you're feeding the component?

@RooRoo6080
Copy link
Author

The same problem occurs when using the sample data. I ended up fixing it by editing some values in bundle.js when installed from npm.
I believe it was somewhere between line 61 and 85. In general, these are nice values to edit to change the looks. This is what I use now:

      width: 125,
      boxHeight: 125,
      canvasPadding: 50,
      spaceBetweenColumns: 15,
      spaceBetweenRows: -60,
      connectorColor: "#415a77",
      connectorColorHighlight: "#DDD",
      roundHeader: {
        isShown: !0,
        height: 10,
        marginBottom: 0,
        fontSize: 12,
        fontColor: "white",
        backgroundColor: "rgb(47, 54, 72)",
        fontFamily: '"Montserrat", "Arial", "Helvetica", "sans-serif"',
        roundTextGenerator: void 0
      },
      roundSeparatorWidth: 0,
      lineInfo: {
        separation: -13,
        homeVisitorSpread: 0.5
      },
      horizontalOffset: 8,
      wonBywalkOverText: "WO",
      lostByNoShowText: "NS"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants