Code Monkey home page Code Monkey logo

Comments (7)

ivanvanderbyl avatar ivanvanderbyl commented on July 26, 2024 2

Support for custom d3 modules has been added to the latest beta: [email protected]

Instructions:

  1. Install the addon
  2. Install d3 and d3-selection-multi
  3. Profit

from ember-d3.

ivanvanderbyl avatar ivanvanderbyl commented on July 26, 2024

@sly7-7 thanks for pointing this out. We'll need to add support for additional D3 plugins to support this, as our current module lookup is tightly coupled to the dependencies of the d3 package.

This is definitely possible and is probably a good idea to support loading other non-standard plugins.

from ember-d3.

ivanvanderbyl avatar ivanvanderbyl commented on July 26, 2024

One way I could see this working, which would be easy for the user to work with, is to just look at the dependencies of the parent project ingesting this addon and load anything starting with d3-.

from ember-d3.

sly7-7 avatar sly7-7 commented on July 26, 2024

@ivanvanderbyl Thanks for the answer. I would be happy to try to tackle this, so if I understand,

  • A user will install the plugins via npm install d3-*
  • In d3-deps-for-package you would complete the actual deps by walking the user's project's package.json and load all d3-* modules ?

Also, I'm not sure what loading a module means. For example in d3-selection-multi,there is no exported funtions, but this file must be interpreted in order to complete the d3.selection.prototype.

I'm sorry, despite the fact I'm consuming the ember-cli ecosystem, I didn't dig into addon development yet, and I know almost nothing about how node modules are working 😞 , so I you could provide me some guidance, that would be great 😄

from ember-d3.

ivanvanderbyl avatar ivanvanderbyl commented on July 26, 2024

@sly7-7 it's far from straight forward unfortunately, which is why this addon exists.

Under the hood, each addon is processed by ember-cli, and provides ember-cli with broccoli trees for each section of the addon (app, addon ,vendor, tests etc). In our case we build a custom tree for vendor which contains each d3 package, correctly named and converted to AMD so you can import it using import selection from 'd3-selection etc.

We already have most of what we need to make this work, except for simplicity at the moment we just resolve modules from the d3 npm package's package.json. This would probably work if we can just extend that to also check the dependencies of the parent addon, but this gets tricky because ember-cli doesn't expose a solid API for detecting what that is. You'll see in index.js that we search app.app until we find it.

IIRC app.app.project has an API for querying the dependencies of the parent addon, so that'd be a place to start.

from ember-d3.

sly7-7 avatar sly7-7 commented on July 26, 2024

I've tried playing with that, but it appears an obscure error for me, something during the AMD rewrite.

for the d3-selection-multi: `[{value: d3-selection-multi, loc: null, type: Literal, comments: null, regex: null}, {elements: , loc: null, type: ArrayExpression, comments: null}, ] does not match field "arguments": [Expression | SpreadElement] of type CallExpression``

I think it's because d3-selection-multi does not export anything, but simply modify the prototype of d3-selection. This may be related: d3/d3-selection-multi#6 and rollup/rollup#738

At this point, I don't know what need to be done...

from ember-d3.

IAmJulianAcosta avatar IAmJulianAcosta commented on July 26, 2024

I created a PR that will load any D3 plugin that appears in package.json. This is far to be an optimal solution, but it works fine.

from ember-d3.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.