Reputation: 256
I'm looking for a Javascript charting framework that allows for non-uniform x-axis spacing. I have perused many JS charting frameworks, but the online documentation that I have found universally does not make clear whether or not the tool allows irregularly-spaced x-axis values.
I know that one solution is to just resample my data at the GCD of my data points, but that is impractical given the size of my dataset. Instead, it would be most beneficial if I could simply plot only the x-axis values I choose.
Is there any tool that contains this capability?
Edit: It's fine if the chart has a uniform axis, but I want my data source to be non-uniform. In other words, it's ok if my axis goes 1 2 3 4 5 6 7
, but I might only want to plot data at 2 3 5 7
.
Edit 2: What I really want is a JS library that can make a plot look like this:
which is easily generated by the following MATLAB code:
t = [ 13.23, 105.81, 196.40]; y = [ 10, 11.5, 14.8]; plot(t,y);
hold on
plot(t,y,'o','MarkerSize',6)
axis([0 200 0 20])
Upvotes: 2
Views: 125
Reputation: 2608
In ZingChart, you can use [x,y] pairs in the values array.
"scale-x":{
"values":"0:200:20"
},
"scale-y":{
"values":"0:20:2"
},
"series": [
{
"values": [[13.23,10],[105.81,11.5],[196.40,14.8]]
}
]
Here's a live demo.
Disclaimer: I'm on the ZingChart team. If you have any questions about implementation, feel free to give us a holler.
Upvotes: 1
Reputation: 14053
Ah, what the heck. Using, for example, Flot:
$.plot("#placeholder", [
[[13.23, 10], [105.81, 11.5], [196.40, 14.8]]
],{
xaxis: { min: 0, max: 200 },
yaxis: { min: 0, max: 20 }
});
Upvotes: 2