Highcharts - creating chart with same scale axis
<p>I'm trying to create combined chart with line and semi-circles with numerical x and y axis. I have a problem because I can't create the chart with axis in same scale. How every I try I always get different proportions of x and y scale.
Here is an example: <a href="https://jsfiddle.net/nje5cj6x/" rel="nofollow">https://jsfiddle.net/nje5cj6x/</a>.</p>

<pre><code>    var data = [
        [10, 100],
        [20, 150],
        [30, 200],
        [40, 250],
        [50, 300]
  ];
</code></pre>

<p>So, the container has the same width and height, both axis are the same, but still x and y axis are not the same proportions:
<a href="http://i.stack.imgur.com/Lm15e.jpg" rel="nofollow">Measured width and height</a></p>

<p>So, on this graph each point on the line should intersect with corresponding semi-circle at 90'. Can this be done?</p>

<p>Also, can I add some extra data in data var? For example, I'd like to pass variable r, besides x and y for radius? But if I do that, values are not calculated in same scale, so if I edit the code to:</p>

<pre><code>chart.renderer.arc(point.plotX + chart.plotLeft, point.plotY + chart.plotTop, point.r, point.r, -Math.PI, 0)
</code></pre>

<p>I get even worse result. </p>

<p>Thanks!</p>