diff --git a/src/diagrams/class/classRenderer-v2.js b/src/diagrams/class/classRenderer-v2.js index 2f7dad20e..7e5176d35 100644 --- a/src/diagrams/class/classRenderer-v2.js +++ b/src/diagrams/class/classRenderer-v2.js @@ -32,6 +32,7 @@ export const addClasses = function(classes, g) { // const svg = select(`[id="${svgId}"]`); const keys = Object.keys(classes); logger.info('keys:', keys); + logger.info(classes); // Iterate through each item in the vertex object (containing all the vertices found) in the graph definition keys.forEach(function(id) { @@ -154,8 +155,8 @@ export const addRelations = function(relations, g) { logger.info(edgeData, edge); //Set relation arrow types - edgeData.arrowStartType = getArrowMarker(edge.relation.type1); - edgeData.arrowEndType = getArrowMarker(edge.relation.type2); + edgeData.arrowTypeStart = getArrowMarker(edge.relation.type1); + edgeData.arrowTypeEnd = getArrowMarker(edge.relation.type2); let style = ''; let labelStyle = ''; @@ -409,7 +410,7 @@ export const draw = function(text, id) { // Run the renderer. This is what draws the final graph. const element = select('#' + id + ' g'); - render(element, g, ['point', 'circle', 'cross'], 'classDiagram', id); + render(element, g, ['aggregation', 'extension', 'composition', 'dependency'], 'classDiagram', id); // element.selectAll('g.node').attr('title', function() { // return flowDb.getTooltip(this.id); diff --git a/src/themes/class.scss b/src/themes/class.scss index db9a3606b..a5545d9b2 100644 --- a/src/themes/class.scss +++ b/src/themes/class.scss @@ -47,45 +47,45 @@ g.classGroup line { } @mixin composition { - fill: $nodeBorder; - stroke: $nodeBorder; + fill: $nodeBorder !important ; + stroke: $nodeBorder !important ; stroke-width: 1; } -#compositionStart { +#compositionStart, .composition { @include composition; } -#compositionEnd { +#compositionEnd, .composition { @include composition; } @mixin aggregation { - fill: $nodeBkg; - stroke: $nodeBorder; + fill: $nodeBkg !important ; + stroke: $nodeBorder !important ; stroke-width: 1; } -#aggregationStart { +#aggregationStart, .aggregation { @include aggregation; } -#aggregationEnd { +#aggregationEnd, .aggregation { @include aggregation; } -#dependencyStart { +#dependencyStart, .dependency { @include composition; } -#dependencyEnd { +#dependencyEnd, .dependency { @include composition; } -#extensionStart { +#extensionStart , .extension{ @include composition; } -#extensionEnd { +#extensionEnd, .extension { @include composition; }