So I am learning flot charts, but I am having a difficult time getting the label to show up or the legend when using options. Certain of the options will work (like the fill and fillColor of the lines), but not others? Banging my head on desk
For some reason it doesn't show up at all in jsfiddle, but it does in my web app.
<h1>Flot Examples</h1>
<div id="placeholder" class="placeholder" style="width:500px; height:300px; background-color:darkcyan;" runat="server">
<script type="text/javascript">
var data, data1, dataTime, options, chart;
var date = new Date(); //2015
var date1 = date.setDate(date.getDate());
var date2 = date.setDate(date.getDate() - 365); //2015
var date3 = new Date(date.getFullYear() - 2, date.getMonth() - 5, date.getDate() - 6);
dataTime = [
[date1, 1],
[date2, 3],
[date3, 6]
];
data2 = [dataTime];
data1 = [
[1, 4],
[2, 5],
[3, 6],
[4, 9],
[5, 7],
[6, 6],
[7, 2],
[8, 1],
[9, 3]
];
data = [data1];
options = {
series: {
//bars: { show: true }
lines: {
show: true,
// fill: true,
//fillColor: "#000000"
},
},
xaxis: {
mode: "time"
},
yaxis: {
min: 1
},
selection: {
mode: "x"
},
grid: {
show: true
},
// clickable: true,
// hoverable: true,
shadowSize: 20,
highlightColor: "#ffffff", //this is the color of the circle that appears
label: {
string: "invisible"
},
tooltip: true,
legend: {
show: true,
labelBoxBorderColor: "#ffffff",
position: "ne",
margin: 10,
backgroundColor: "#66ccff",
}
};
$(document).ready(function() {
// chart1 = $.plot($('<%= placeholder.ClientID %>'), data, options);
chart1 = $.plot($(".placeholder"), data2, options);
});
</script>![enter image description here][1]
I'd recommend this plugin for axis labels: https://github.com/markrcote/flot-axislabels. It lets you add a label for both x and y axis really simply.