Chart cubic interpolation

Hi, I took an example from following site:

https://www.chartjs.org/samples/latest/charts/line/interpolation-modes.html

and I wonder if chart component offers similar functionality. I have a simple chart with one value and I would like to make it more pleasant to an eye by having the line smoothly drawn. For example, in the picture below, I have a green line and i want it to be drawn like the red line.

Thanks for any advice

You can add XYSplineRenderer even though it isn’t in the list of renderer under Dataset Customizer.

I would do something as below:

from org.jfree.chart.renderer.xy import XYSplineRenderer

chart = event.source.chart
plot = chart.getXYPlot()

renderer = XYSplineRenderer()

# The Precision makes curve smooth ! You can play with changing the numbers.

renderer.setPrecision(15)

plot.setRenderer(renderer)

I have this script on the mouseClicked Event Handler of the chart which changes the chart to curve when I click on it. Best Idea would be to have it on ConfigureChart Extended Function !!

7 Likes

How would multiple datasets or pens change the code? Thank you!

If you’re adding a new series (dataset), code won’t change as long it’s the same plot because you’re rendering to the plot which includes all series.

1 Like

Oddly, the second dataset wouldn’t correctly render for me. I had to use this:

	from org.jfree.chart.renderer.xy import XYSplineRenderer
	
	plot = chart.getPlot()
	rendererCount = plot.getRendererCount()
	
	renderer = XYSplineRenderer()
	
	# The Precision makes curve smooth ! You can play with changing the numbers.
	
	renderer.setPrecision(15)
	
	for i in range(rendererCount):
		plot.setRenderer(i, renderer)

Also this completely breaks if you use subplots, as the plot type goes to CombinedDomainXYPlot.

This seems to work for me:

	from org.jfree.chart.renderer.xy import XYSplineRenderer

	renderer = XYSplineRenderer()
	# The Precision makes curve smooth ! You can play with changing the numbers.
	renderer.setPrecision(15)

	plot = chart.getPlot()
	# Get plot type
	plotType = plot.getPlotType()
	
	if plotType == 'XY Plot': 
		rendererCount = plot.getRendererCount()
		for i in range(rendererCount):
			plot.setRenderer(i, renderer)
	if plotType == 'Combined_Domain_XYPlot':
		subplots = plot.getSubplots()
		for subplot in subplots:
			rendererCount = subplot.getRendererCount()
			for i in range(rendererCount):
				subplot.setRenderer(i, renderer)

3 Likes

I was, without a doubt, expecting something like this from you !!
Got much to learn from you through this forum.
Thanks

1 Like

Thank you Jordan,
I have tried your code and it makes all lines smooth as intended.
Problem is, that all lines are now colored red. See picture below:


Without the code the chart looks like this:

How can I set different colors to those lines and also get rid of those shapes attached to them?

Try this...

from org.jfree.chart.renderer.xy import XYSplineRenderer
from java.awt import Color, Font

chartColors = [Color.BLACK, Color.GREEN, Color.CYAN, Color.orange, Color.GRAY]


renderer = XYSplineRenderer()
`# The Precision makes curve smooth ! You can play with changing the numbers.`
renderer.setPrecision(15)

#This will hide the shapes !
renderer.setBaseShapesVisible(0)
chart = event.source.chart
plot = chart.getPlot()

`# Get plot type`
plotType = plot.getPlotType()

if plotType == 'XY Plot': 
	rendererCount = plot.getRendererCount()
	for i in range(rendererCount):
		plot.setRenderer(i, renderer)
if plotType == 'Combined_Domain_XYPlot':
	subplots = plot.getSubplots()
	for subplot in subplots:
		rendererCount = subplot.getRendererCount()
		for i in range(rendererCount):
			subplot.setRenderer(i, renderer)

#set dynamic Colors - 	
for i in range(plot.getSeriesCount()):
	plot.getRenderer().setSeriesPaint(i, chartColors[i %(len(chartColors))])
2 Likes

Anyway to do this in Perspective?