Size graph to parent element
entone opened this issue · comments
I'm working on a responsive design, and I'd really like to have the graph's width adjust based on the view port. I'm currently not aware of a way to get a DOM element's width in Elm, and the scales appear to require a hard width to render correctly.
Do you have any ideas or workarounds for this?
My hope is that this will eventually make it into elm-lang/dom.
Until then, the one workaround is to use responsive SVGs. This is a major pain to deal with. The only thing I managed to get working is something like this:
http://stackoverflow.com/questions/38018204/svg-scaling-for-line-chart
Then use scales with range of (0, 100)
and post-process the values to add a percentage symbol after them.
I'm hesitant to recommend this approach, because it makes it very difficult to work with the chart and I ended up making a hard coded chart and simply changing the hardcoded size based on the viewport width.
You could of course use ports to get the width.
Hope this helps.