[英]D3: Is it possible to draw a line and assign it to two axes depending on threshold?

I`m trying to create a line chart where the vertical axis is split up into two parts. Both parts have different scales, see the following chart ( i´m only talking about the right axis, where the scale changes at value of 100mm): https://upload.wikimedia.org/wikipedia/commons/6/60/Klimadiagramm-deutsch-Bombay-Indien.png

我試圖創建一個折線圖,其中垂直軸分為兩部分。兩個部分都有不同的比例,請參見下圖(我只談右軸,其中比例變化為100mm):https://upload.wikimedia.org/wikipedia/commons/6/60/Klimadiagramm -deutsch - 孟買 - Indien.png

So the only idea i had was to split up the input data into values below and above the threshold and then create separate lines and areas out of this data. But this seems to me like quite an unhandy solution, so before i start doing that, i wanted to ask here: Does anybody have a better idea?


1 个解决方案



You can try to use a power scale. It can give you a desired effect. Look here (http://bl.ocks.org/GerHobbelt/3605124). It wont be as precise as the axis on your example.


If you need a scale that exactly match your example, then you'll have to implement it on your own just the way you described. One from 0 to 100 with the range taking the lower half of the height and another from 100 to 900 with the range taking the upper half. You'll also get two axis that you'll have to match horizontally. One of them will be missing min/max value. You can then abstract it into a function. Good luck!




粤ICP备14056181号  © 2014-2021 ITdaan.com