0

I'm pretty out of solutions here I'm creating a multi graph, with graps added dynamically by user Which is why I had to give variable names to the scales using the window method All seemed to work awesome, looks good also, however I am not seeing the values I am supposed to on the graph My initial values come from ajax

for example the start_range and end_range are 130,0 second ones are 290-160 basically increasing from top to bottom with 130 (height of each graph) and the 30 px I put between them the domains are 1415,1500 for the first graph and -20,20 for the second

And now the problems - I am trying to put a threshold line at 1437 in the first and 0 in the second

 g.append('line')
                .attr('x1', 0) //starts at first x
                .attr('y1', window['scale_vwl'](0)) //starts where I tell him in the function argument
                .attr('x2',width)  //ends at last x (fortunately the x are the same for all arrays (data1,data2 etc)
                .attr('y2', window['scale_vwl'](0))
                .attr('class', 'mediumline');

On the graph it is positioned somewhere near 1457 in the first case and 10 in the second (where it should be 0)

I thought maybe I mixed up some margins but the difference from where it is and where i want it is 20 in the first case and 10 in the second so i cannot force something like -20

I tried making 0 all the margins, still gives me wrong positioned line How come it's there? I tried alert(window['scale_'+param_name](1437)) and it gives me 95

I read the way the scales are transformed, so I've done it too my initial interval 1415-1500, difference=85 my graph interval 0-130, difference 130

factor = 85 / 130 = 0.65

but 1437 / 0.65 = 2210,7 I feel totally lost

And the second question is -.if I create the line and the circles based on my data, how come they are in different positions in the graph? (the circles are on top) which is correct?

I've desperately searched and nothing emerged Please just give me a hint if possible

Here is a working fiddle https://jsfiddle.net/zk5j5fno/ Thank you

4

1 回答 1

0

在它自己的 svg 中构建每个图可能会更容易。你现在所拥有的，患有too many magic numbers综合症。一旦您开始手动输入像素位置，您就需要重新考虑您的方法。例如：

 build_yaxis_path('vwl', data2, 290, 160, -20, 20); //<- why 290, why 160?

就是说，这条线超出了您的比例（实际上比例很好，轴放置不正确）：

//append axis
g.append("g")
  .attr("class", "y axis " + param_name)
  .style("fill", "steelblue") //here change color
  .attr('transform', 'translate(0, 30)') //<-- 30?

如果您摆脱那条线，则比例和轴匹配。当然，这会导致您不得不在其他地方进行调整...

这是一个我已经解决了一些问题的示例。

于 2015-03-29T14:21:18.477 回答