Comments (8)
percentage based dimensions for? The nf-graph
container itself?
from ember-nf-graph.
Yeah for the nf-graph
component, instead of pixel based width/height
from ember-nf-graph.
So this is tricky.
The pixel values passed to width
and height
are used to calculate the scale of the graphed elements. In order to get those, I'd need to check to see if what was passed happened to be a string ending with "%", then setup an event to detect when the SVG has resized. ... that's where this gets tricky. The only reliable way I know of to get when the SVG has been resized is to poll repeatedly and check it's computed size. This is because while a document resize event will help, it's not the only way to resize the parents of the SVG of the nf-graph component. If any DOM parent of the SVG element is updated, it will resize the SVG, and we need to know. Unfortunately there isn't a great event for that. MutationObservers may help, but aren't reliable in every browser, and may have performance implications... So I'd want to set them up only when the size was set to a percentage, and tear them down otherwise.
from ember-nf-graph.
I'm not saying we're definitely not going to implement this. In fact, it might even end up being a requirement for the project this was birthed from. I'm really saying that this is a non-trivial change that could end up being buggy or slow on some platforms.
from ember-nf-graph.
I'm adding wontfix
to this and closing it, for now.
BUT I will keep this in mind because it's likely to come up on our app here.
from ember-nf-graph.
@Blesh I figured that would be case. Basically all the work would have to be invoked after the node is inserted in the DOM. Thanks anyway!
from ember-nf-graph.
This could be the solution: EmberSherpa/ember-element-resize-detector
from ember-nf-graph.
@ming-codes as I recall, we used something like that to handle resizing these components at Netflix
from ember-nf-graph.
Related Issues (20)
- Bar chart xScaleType="ordinal" hides x-axis labels HOT 6
- Feature proposal: more flexibility to manipulate the lanes (maybe frets too) HOT 1
- "You modified ... twice in a single render" deprecation warnings HOT 2
- Custom templates for nf-x-axis and nf-y-axis are not working HOT 7
- Axes don't recompute if data object is modified HOT 1
- Ember 2.0 support HOT 1
- nf-x-axis documentation HOT 4
- High severity vulnerability affecting this repo
- Improve documentation
- Fix failing tests
- .travis.yml: The 'sudo' tag is now deprecated in Travis CI
- app/ components need to use the new cp syntax
- Tick labels don't work on Glimmer HOT 10
- Mouse Tracking doesn't work on Glimmer HOT 6
- How can I label every line or area chart inside a graph-content? HOT 1
- maxProperty doesn't have a good way to use "default" HOT 17
- contentClipPathId doesn't work on apps with <base> tag HOT 4
- nf-graph should not disable user-select/drag for every element within HOT 2
- Brush Select To Zoom throws "Cannot read property 'insertBefore' of null" HOT 8
- Remove clippath
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ember-nf-graph.