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.

Sign up for GitHub

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

Jump to bottom

Support styling of subgraphs #845

Merged
merged 1 commit into from
May 28, 2019
Merged

Support styling of subgraphs #845

merged 1 commit into from
May 28, 2019
+191 −110

Conversation

Qix-
Copy link
Contributor

@Qix- Qix- commented May 24, 2019 •
edited
Loading

Closes #391.

This PR changes the DSL and will break any subgraph definitions that have multiple words in the title without quotes.

For example, the following subgraph will break:

subgraph Foo Bar
...
end
Loading

It adds the following id[Title] syntax, as per #391 (comment):

subgraph
// Anonymous subgraph
end

subgraph "Some Title"
// Anonymous subgraph with title
end

subgraph some-id
// ID'd subgraph
end

subgraph some-id[Some Title]
// ID'd and titled subgraph
end
Loading

Any ID'd subgraph can now be used with the style command:

graph TD
subgraph some-id[Title]
    A --> B
end

style some-id fill:#F77,stroke:#F00,stroke-width:2px
Loading

image

Note that given how subgraph SVG tags are built up, there is no (current) way to style the title text.

@coveralls
Copy link

Pull Request Test Coverage Report for Build 753

  • 38 of 54 (70.37%) changed or added relevant lines in 3 files are covered.
  • No unchanged relevant lines lost coverage.
  • Overall coverage increased (+0.06%) to 54.316%
Changes Missing Coverage Covered Lines Changed/Added Lines %
src/diagrams/flowchart/flowRenderer.js 0 1 0.0%
src/diagrams/flowchart/flowDb.js 12 16 75.0%
src/diagrams/flowchart/parser/flow.js 26 37 70.27%
Totals Coverage Status
Change from base Build 716: 0.06%
Covered Lines: 2062
Relevant Lines: 3770
💛 - Coveralls

@Qix- Qix- mentioned this pull request May 26, 2019
Closed
@knsv knsv merged commit 23693bd into mermaid-js:master May 28, 2019
@Qix- Qix- deleted the style-subgraph branch May 29, 2019 15:41
@Qix-
Copy link
Contributor Author

Qix- commented May 29, 2019

Can we get a release for this @knsv? :)

@knsv
Copy link
Collaborator

knsv commented Jun 9, 2019

A release is coming but I am afraid it will take a few weeks. We are aiming for a quicker pulse moving forward by making the release process/test less manual. We are also expanding the core team. If you are interested take a look at the readme file for the areas we need help with if you want to take a more active role.

@stanhu stanhu mentioned this pull request Jul 30, 2019
Closed
@stanhu
Copy link
Contributor

stanhu commented Jul 30, 2019

We had a number of users run into this change breaking their diagrams (#895). Is there a way we can preserve backwards compatibility?

tigefa4u pushed a commit to tigefa4u/gitlabhq that referenced this pull request Jul 30, 2019
@stanhu
Document required quotes in Mermaid subgraph titles
13972a8 
Mermaid v8.2.3 added support for styling in subgraphs, but if there are
multiple words in a title, quotes are required.

```
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph "SubGraph 1 Flow"
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph "Main Graph"
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```

```
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph SubGraph 1 Flow
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph Main Graph
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```

* mermaid-js/mermaid#845
* mermaid-js/mermaid#391 (comment)

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/65338
tigefa4u pushed a commit to tigefa4u/gitlabhq that referenced this pull request Jul 31, 2019
@stanhu
Document required quotes in Mermaid subgraph titles
7d2b579 
Mermaid v8.2.3 added support for styling in subgraphs, but if there are
multiple words in a title, quotes are required.

```
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph "SubGraph 1 Flow"
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph "Main Graph"
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```

```
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph SubGraph 1 Flow
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph Main Graph
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```

* mermaid-js/mermaid#845
* mermaid-js/mermaid#391 (comment)

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/65338
tigefa4u pushed a commit to tigefa4u/gitlabhq that referenced this pull request Jul 31, 2019
@stanhu
Document required quotes in Mermaid subgraph titles
e4a80d1 
Mermaid v8.2.3 added support for styling in subgraphs, but if there are
multiple words in a title, quotes are required.

```
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph "SubGraph 1 Flow"
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph "Main Graph"
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```

```
graph TB

  SubGraph1 --> SubGraph1Flow
  subgraph SubGraph 1 Flow
  SubGraph1Flow(SubNode 1)
  SubGraph1Flow -- Choice1 --> DoChoice1
  SubGraph1Flow -- Choice2 --> DoChoice2
  end

  subgraph Main Graph
  Node1[Node 1] --> Node2[Node 2]
  Node2 --> SubGraph1[Jump to SubGraph1]
  SubGraph1 --> FinalThing[Final Thing]
end
```

* mermaid-js/mermaid#845
* mermaid-js/mermaid#391 (comment)

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/65338
tigefa4u pushed a commit to tigefa4u/gitlabhq that referenced this pull request Jul 31, 2019
@stanhu
Document required quotes in Mermaid subgraph titles
8f9b2fc 
Mermaid v8.2.3 added support for styling in subgraphs, but if there are
multiple words in a title, quotes are required.

* mermaid-js/mermaid#845
* mermaid-js/mermaid#391 (comment)

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/65338
tigefa4u pushed a commit to tigefa4u/gitlabhq that referenced this pull request Aug 2, 2019
@stanhu
Document required quotes in Mermaid subgraph titles
2ef293e 
Mermaid v8.2.3 added support for styling in subgraphs, but if there are
multiple words in a title, quotes are required.

* mermaid-js/mermaid#845
* mermaid-js/mermaid#391 (comment)

Closes https://gitlab.com/gitlab-org/gitlab-ce/issues/65338
@X-oss-byte X-oss-byte mentioned this pull request Oct 21, 2023
Open
@tiffany76 tiffany76 mentioned this pull request Feb 28, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Styling subgraph?
4 participants
@Qix- @coveralls @knsv @stanhu