parallel-coordinates icon indicating copy to clipboard operation
parallel-coordinates copied to clipboard

d3 v4 and TypeScipt

Open SamuelMarks opened this issue 7 years ago • 8 comments

I've done some work to upgrade to the latest d3; and also rewrote in TypeScript.

@syntagmatic ; not sure what your plans are for this library.

SamuelMarks avatar Jan 26 '18 08:01 SamuelMarks

I would go ahead and use your fork as the main development branch. I don't have time to maintain/evolve this version, so there's definitely room for a better implementation to take over. Typescript is a good idea, I just don't want to add another layer here for anyone who's been using the library for a while.

syntagmatic avatar Jan 26 '18 09:01 syntagmatic

Hmm, well @syntagmatic the main idea with TypeScript is that you just add type annotations and it'll still compile down to pure JavaScript.

So people won't need to change a line of their code to use it as a library, and for those developing they get type hints.

This is especially useful in this case, where many d3 functions have been obsoleted; the compiler just tells me:

Error:(784, 8) TS2339: Property rebind does not exist on type 'typeof "parallel-coordinates/node_modules/@types/d3/index"'.

Regardless would you be able to resolve my queries when I have questions about why things don't work?

E.g.: what is $V at (and 3 other places): https://github.com/syntagmatic/parallel-coordinates/blob/4259bf2064cadc07d0302db57c22f60d15d66bea/d3.parcoords.js#L527 and what is the k meant to be at: https://github.com/syntagmatic/parallel-coordinates/blob/4259bf2064cadc07d0302db57c22f60d15d66bea/d3.parcoords.js#L339

SamuelMarks avatar Jan 26 '18 09:01 SamuelMarks

I'm not sure what the $V references, it may have been related to a vector library.

That k appears to be a bug. I doubt that block would run without errors.

syntagmatic avatar Jan 26 '18 09:01 syntagmatic

Hmm, alright. Okay @syntagmatic I have finished rewriting d3.parcoords so it compiles in TypeScript.

Now down to the d3 v3 → v4 upgrade: screen shot 2018-01-27 at 4 23 33 pm


Can you assist with the d3 v3 → v4 upgrade?

SamuelMarks avatar Jan 27 '18 05:01 SamuelMarks

Getting closer: screen shot 2018-01-27 at 7 25 17 pm

Added little TODO helpers with a candidate rewrite when it wasn't a 1:1 replacement in implementation (e.g.: flattened namespace or rename):

  1. axis = d3.axis().orient('left').ticks(5);
  2. xscale.rangePoints([0, w()], 1);
  3. brush.y(__.dimensions[axis].yscale), possibly this is how
  4. xscale.rangePoints([0, w()], 1);

Then just:

  1. Replacing functor (see official upgrade guide)
  2. Replacing rebind (see official upgrade guide)

Not sure about multibrush, but it's kind of optional anyway so we can put it to one side for now.

SamuelMarks avatar Jan 27 '18 08:01 SamuelMarks

@SamuelMarks Pretty sure $V comes from sylvester: http://sylvester.jcoglan.com/

timpelser avatar May 03 '18 13:05 timpelser

Oh good, it has types: https://www.npmjs.com/package/@types/sylvester

SamuelMarks avatar May 03 '18 13:05 SamuelMarks

Great work. Thanks for doing this @SamuelMarks!

nonoesp avatar Jun 27 '18 14:06 nonoesp