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

Add fontColor as a configuration option for node's <text> fill property #64

Merged
merged 8 commits into from Apr 11, 2018

Conversation

@dmmulroy
Copy link
Contributor

dmmulroy commented Apr 10, 2018

This enables users to set a fontColor under the node configuration option that will set the Node Components svg elements fill color.

dy: CONST.NODE_LABEL_DY,
fontSize: this.props.fontSize,
fontWeight: this.props.fontWeight,
fill: this.props.fontColor,

This comment has been minimized.

Copy link
@dmmulroy

dmmulroy Apr 10, 2018

Author Contributor

Prettier ran and formatted this file so it's hard to tell, but this is the main change in this file (the addition of fill on textProps)

This comment has been minimized.

Copy link
@danielcaldas

danielcaldas Apr 11, 2018

Owner

Regarding the indentation can you please change the file react-d3-graph/.prettierrc.js? It has a typo 😄 , tabWidt should be tabWidth: 4, this should make prettier reindent the file correctly. Thanks!

Dillon Mulroy
@dmmulroy

This comment has been minimized.

Copy link
Contributor Author

dmmulroy commented Apr 10, 2018

I'll get to this tonight and fix the tests

@danielcaldas

This comment has been minimized.

Copy link
Owner

danielcaldas commented Apr 10, 2018

Nice one @dmmulroy 👌, I'll complete the code review asap.

@dmmulroy

This comment has been minimized.

Copy link
Contributor Author

dmmulroy commented Apr 10, 2018

Fixed up the tests, everything should be good to go!

@@ -59,6 +59,7 @@
* property for all nodes' labels.
* @param {string} [node.fontWeight='normal'] - {@link https://developer.mozilla.org/en/docs/Web/CSS/font-weight?v=control|font-weight}
* property for all nodes' labels.
* @param {string} [node.fontWeight='normal'] - fill color for node's <text> svg label

This comment has been minimized.

Copy link
@danielcaldas

danielcaldas Apr 10, 2018

Owner

Just some minor details here:

  1. node.fontColor='black' instead of node.fontWeight;
  2. Properties are ordered alphabetically, so fontColor should be on top of fontWeight (both here and in the config object)
@@ -3,7 +3,7 @@
object-assign

This comment has been minimized.

Copy link
@danielcaldas

danielcaldas Apr 10, 2018

Owner

Please check out this change, I'll generate the sandbox bundle upon a new rd3g release, thanks

@@ -294,6 +294,7 @@ function buildNodeProps(node, config, nodeCallbacks = {}, highlightedNode, highl
const dx = fontSize * t + nodeSize / 100 + 1.5;
const strokeWidth = highlight ? config.node.highlightStrokeWidth : config.node.strokeWidth;
const svg = node.svg || config.node.svg;
const fontColor = config.node.fontColor || 'green';

This comment has been minimized.

Copy link
@danielcaldas

danielcaldas Apr 10, 2018

Owner

Please use the following:

const fontColor = node.fontColor || config.node.fontColor;

This way each node will be able to override the global defined color (the global is the on in config.node.fontColor)

@@ -27,6 +27,7 @@ import nodeHelper from './node.helper';
* fontSize=10
* dx=90
* fontWeight='normal'
* fontColor='black'

This comment has been minimized.

Copy link
@danielcaldas

danielcaldas Apr 10, 2018

Owner

Place fontColor on top of fontWeight

@@ -22,6 +22,7 @@ exports[`Snapshot - Node Component should match snapshot 1`] = `
<text
dx=".90em"
dy=".35em"
fill={undefined}

This comment has been minimized.

Copy link
@danielcaldas

danielcaldas Apr 11, 2018

Owner

Please check whether this value should have value black

@dmmulroy

This comment has been minimized.

Copy link
Contributor Author

dmmulroy commented Apr 11, 2018

Changes should be in

@danielcaldas danielcaldas merged commit e4ef748 into danielcaldas:master Apr 11, 2018
1 check passed
1 check passed
continuous-integration/travis-ci/pr The Travis CI build passed
Details
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants
You can’t perform that action at this time.