All,
I am using FLOT, and I am trying to combine a couple of plots on the same diagram. The first plot is of the "horizontal stacked bar" type, and the second one is a 'garden-variety' time-varying quantity ...
I can display the two plots individually, but I cannot combine them ...
Please note that both plots share the x-axis.
First plot
var min = -10;
var data1 = [
{ "data": [[ 2, min]], "color": 1},
{ "data": [[ 3, min]], "color": 0},
{ "data": [[ 1, min]], "color": 1},
{ "data": [[ 8, min]], "color": 2},
{ "data": [[ 6, min]], "color": 1}
];
var options1 = {
series: {
stack: true,
lines: {show: false, steps: false },
bars: {show: true, horizontal:true, width: 1}
},
yaxis: {
min: min,
max: 20
}
};
$.plot("#placeholder1", data1, options1);
Second plot
var data2 = [];
var t = [];
var i = 0;
for (var tt = 0; tt <= 20; tt += 1) {
data2.push([i, Math.exp(-tt/10.)*9*Math.cos(2.0*Math.PI*0.1*tt)+9]);
t.push(tt);
i++;
}
var options2 = {
series: {
lines: {
show: true
}
},
yaxis: {
min: min,
max: 20
}
};
$.plot("#placeholder2", [data2], options2);
Failed attempt to display both plots
var obj1 = {
data: data1,
series: {
stack: true,
lines: {show: false, steps: false },
bars: {show: true, horizontal:true, width: 1}
}
};
var obj2 = {
data: [data2],
series: {
lines: {
show: true
}
},
yaxis: {
min: min,
max: 20
}
}
$.plot("#placeholder3", obj1, obj2);
See Pen here: http://codepen.io/vpappano/pen/BQrgRQ
Any help will be greatly appreciated.
Thanks !!! :-)
Multiple points:
data1
is already an array of data series objects, it can not be the data
property for another data seriesplot()
doesn't support multiple data series as in your code, give an array of data series as second parameter and the options as third parameterFixed CodePen: http://codepen.io/anon/pen/vyjYNo