Question

I would like to generate a Highcharts scatter chart with oval markers with variable height and width. To create the oval, I'm using a custom marker, and generating the necessary curves in the renderer. However, the required width and height of each oval is different. Ideally, I'd like to specify something akin to

data:[{x:0, y:0, marker:{radius:{w:3,h:7}} }]

and then use that information when creating the oval in the renderer.

However, Highcharts doesn't like the object as the radius value. Is there a way to pass arbitrary data to the renderer? I'm currently using a hack in which I pass the renderer an index into an external array via the marker radius, but I'm hoping there's a sanctioned way since this is creating some undesirable side effects.

Current JSFiddle here

Appreciate any thoughts!

Was it helpful?

Solution

You need to wrap drawPoints function, which uses

point.graphic = graphic = chart.renderer.symbol(
                        symbol,
                        plotX - radius,
                        plotY - radius,
                        2 * radius,
                        2 * radius
                    )
                    .attr(pointAttr)
                    .add(markerGroup);

but should your custom paramter lik rx/ry in marker, not default r / radius.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top