Problem/Motivation

I created a module, Workflows Field Diagram, with a FieldFormatter for the Workflows field.
It uses the Theme of this module.

I would like to be able to change the direction of the flowchart that mermaid.js is displaying from TB (top to bottom) to LR (left to right) / give the users of the Fieldformatter a Settingsform to choose any other direction that mermaid.js supports.

So instead of
$mermaid = 'graph TB;';
I would like to be able to change the TB to anything is supported as Flowchart direction

Proposed resolution

1. Pass Argument $graphDirection to the Controller with "TD" as default value.
2. change this line:
https://git.drupalcode.org/project/workflows_diagram/-/blob/1.0.x/src/Co...

Comments

verfranzt created an issue. See original summary.

  • maxwellkeeble committed 9a8b421 on 1.0.x 
    Issue #3293360: Allow the Mermaid JS flowchart direction (TB, BT, LR, RL...
maxwellkeeble’s picture

maxwellkeeble commented
Status: Needs review » Fixed

Thanks verfranzt, really good idea (and cool to see your module).

I've released a new beta that includes the suggested change, with the theme variable called 'direction', e.g. 

    $form['workflow_diagram'][] = [
      '#theme' => 'workflows_diagram',
      '#workflow' => $form_state->getFormObject()->getEntity(),
      '#direction' => 'LR',
    ];
maxwellkeeble’s picture

maxwellkeeble commented

Sorry to update so quickly, but I've updated it to 'orientation' to match the Mermaid documentation to avoid confusion.

verfranzt’s picture

verfranzt commented

@maxwellkeeble Thank you for your really quick response!
Your module is a great base for mine! thanks for that

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.