2016-04-24 14:26:11 +00:00
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
< html >
< head >
2019-04-08 16:55:26 +00:00
< meta http-equiv = "Content-Type" content = "text/html; charset=utf-8" >
< title > Flot Examples< / title >
< link href = "examples.css" rel = "stylesheet" type = "text/css" >
< style >
h3 {
margin-top: 30px;
margin-bottom: 5px;
}
< / style >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.canvaswrapper.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.colorhelpers.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.saturated.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.browser.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.drawSeries.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.errorbars.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.uiConstants.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.logaxis.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.symbol.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.flatdata.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.navigate.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.fillbetween.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.stack.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.touchNavigate.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.hover.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.touch.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.time.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.axislabels.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.selection.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.composeImages.js" > < / script >
< script language = "javascript" type = "text/javascript" src = "../../source/jquery.flot.legend.js" > < / script >
< script type = "text/javascript" >
$(function() {
// Add the Flot version string to the footer
$("#footer").prepend("Flot " + $.plot.version + " – ");
});
< / script >
2016-04-24 14:26:11 +00:00
< / head >
< body >
2019-04-08 16:55:26 +00:00
< div id = "header" >
< h2 > Flot Examples< / h2 >
< / div >
< div id = "content" >
< p > Here are some examples for < a href = "http://www.flotcharts.org" > Flot< / a > , the Javascript charting library for jQuery:< / p >
< h3 > Basic Usage< / h3 >
< ul >
< li > < a href = "basic-usage/index.html" > Basic example< / a > < / li >
< li > < a href = "series-types/index.html" > Different graph types< / a > and < a href = "categories/index.html" > simple categories/textual data< / a > < / li >
< li > < a href = "basic-options/index.html" > Setting various options< / a > and < a href = "annotating/index.html" > annotating a chart< / a > < / li >
< li > < a href = "ajax/index.html" > Updating graphs with AJAX< / a > and < a href = "realtime/index.html" > real-time updates< / a > < / li >
< / ul >
< h3 > Interactivity< / h3 >
< ul >
< li > < a href = "series-toggle/index.html" > Turning series on/off< / a > < / li >
< li > < a href = "selection/index.html" > Rectangular selection support and zooming< / a > and < a href = "zooming/index.html" > zooming with overview< / a > (both with selection plugin)< / li >
< li > < a href = "interacting/index.html" > Interacting with the data points< / a > < / li >
< li > < a href = "navigate/index.html" > Panning and zooming< / a > (with navigation plugin)< / li >
< li > < a href = "navigateTouch/index.html" > Panning and zooming simple and log-axis charts with Touch< / a > (with touchNavigation plugin)< / li >
< li > < a href = "resize/index.html" > Automatically redraw when window is resized< / a > (with resize plugin)< / li >
< / ul >
< h3 > Axes< / h3 >
< ul >
< li > < a href = "axes-time/index.html" > Plotting time series< / a > , < a href = "visitors/index.html" > visitors per day with zooming and weekends< / a > (with selection plugin)< / li >
< li > < a href = "axes-time-zones/index.html" > Time zone support< / a > < / li >
< li > < a href = "log-scale/index.html" > Log scales< / a > < / li >
< li > < a href = "axes-multiple/index.html" > Multiple axes< / a > < / li >
< li > < a href = "axes-interacting/index.html" > Interacting with the axes< / a > < / li >
< li > < a href = "axes-autoscaling/index.html" > Autoscaling options< / a > < / li >
< li > < a href = "axes-tickLabels/index.html" > Tick labels options< / a > < / li >
< li > < a href = "axes-labels/index.html" > Axis labels< / a > < / li >
< / ul >
< h3 > Additional Features< / h3 >
< ul >
< li > < a href = "symbols/index.html" > Using other symbols than circles for points< / a > (with symbol plugin)< / li >
< li > < a href = "threshold/index.html" > Thresholding the data< / a > (with threshold plugin)< / li >
< li > < a href = "stacking/index.html" > Stacked charts< / a > (with stacking plugin)< / li >
< li > < a href = "percentiles/index.html" > Using filled areas to plot percentiles< / a > (with fillbetween plugin)< / li >
< li > < a href = "tracking/index.html" > Tracking curves with crosshair< / a > (with crosshair plugin)< / li >
< li > < a href = "image/index.html" > Plotting prerendered images< / a > (with image plugin)< / li >
< li > < a href = "series-errorbars/index.html" > Plotting error bars< / a > (with errorbars plugin)< / li >
< li > < a href = "plot-legend/index.html" > Plot Legend< / a > < / li >
< li > < a href = "series-pie/index.html" > Pie charts< / a > (with pie plugin)< / li >
< / ul >
< br >
< p > < i >
Note that these examples use the non-minified source, so they will not work on older browsers such as Internet Explorer.
Use the built source (which comes installed with the NPM package) if you need broader support.
< / i > < / p >
< / div >
< div id = "footer" >
Copyright © 2007 - 2013 IOLA and Ole Laursen
< / div >
2016-04-24 14:26:11 +00:00
< / body >
< / html >
