Skip to content

Commit

Permalink
Item2363: initial public release of FlotChartPlugin
Browse files Browse the repository at this point in the history 
git-svn-id: http://svn.foswiki.org/trunk/FlotChartPlugin@5524 0b4bb1d4-4e5a-0410-9cc4-b2b747904278
  • Loading branch information
SvenDowideit authored and SvenDowideit committed Nov 15, 2009
0 parents commit c93ec95
Show file tree
Hide file tree
Showing 70 changed files with 12,908 additions and 0 deletions.
92 changes: 92 additions & 0 deletions data/System/FlotChartPlugin.txt
@@ -0,0 +1,92 @@
%META:TOPICINFO{author="WikiContributor" date="1210258942" format="1.1" reprev="1.1" version="$Rev$"}%
---+!! !FlotChartPlugin
<!--
One line description, required for extensions repository catalog.
* Set SHORTDESCRIPTION = A JQuery based CHARTs for Foswiki
-->
%SHORTDESCRIPTION%

<img src="%PUBURL%/%WEB%/%TOPIC%/FoswikiStatsPlugin.png" style="float:right;margin:20px;" />

%TOC%

---++ Description
Currently based on Flot 0.6

(from http://code.google.com/p/flot)

Flot is a pure Javascript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side.

The focus is on simple usage (all settings are optional), attractive looks and interactive features like zooming.

Although Flot is easy to use, it is also advanced enough to be suitable for Web 2.0 data mining/business intelligence purposes which is its original application.

The plugin is targeting all newer browsers. If you find a problem, please report it. Drawing is done with the =&lt;canvas>= tag introduced by Safari and now available on all major browsers, except Internet Explorer where the =excanvas= Javascript emulation helper is used.

---++ Documentation
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/README.txt][README]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/NEWS.txt][NEWS]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/API.txt][API]]

---++ Examples

---+++ Two series

*You type:*
<verbatim>
%FLOTCHART{
"test,more"
test="[1, 23],[2, 87],[3, 11],[4, 17],[5, 21],[6, 45],[7, 34],[8, 23]"
more="[1, 2],[2, 4],[3, 6],[4, 8],[5, 18],[6, 12],[7, 14],[8, 16]"
xticks="[1, 'start'],[4, 'middle'],[8, 'finish']"
yticks="1,25,50,75,100"
ymax="100"
height="120px"
width="400px"
}%
</verbatim>

*You get:* (if installed)
%FLOTCHART{
"test,more"
test="[1, 23],[2, 87],[3, 11],[4, 17],[5, 21],[6, 45],[7, 34],[8, 23]"
more="[1, 2],[2, 4],[3, 6],[4, 8],[5, 18],[6, 12],[7, 14],[8, 16]"
xticks="[1, 'start'],[4, 'middle'],[8, 'finish']"
yticks="1,25,50,75,100"
ymax="100"
height="120px"
width="400px"
}%

---+++ Distribution examples
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/index.html][Examples index]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/basic.html][Basic example]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/graph-types.html][Different graph types]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/interacting.html][Interacting with the data]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/selection.html][Selection support and zooming]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/setting-options.html][Setting various options]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/time.html][Timeseries of monthly mean atmospheric CO<sub>2</sub> in PPM at Mauna Loa, Hawaii]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/visitors.html][Visitors per day to the Flot homepage]]
* [[%PUBURLPATH%/%SYSTEMWEB%/%TOPIC%/examples/zooming.html][Zooming with overview]]

---++ Installation Instructions

%$INSTALL_INSTRUCTIONS%

---++ Plugin Info

| Plugin Author(s): | Foswiki:Main.SvenDowideit - http://fosiki.com a %PUBURL%/%WEB%/%TOPIC%/wikiringlogo20x20.png [[http://WikiRing.com][WikiRing]] founding partner |
| Copyright: | &copy; SvenDowideit@fosiki.com |
| License: | MIT License |
| Plugin Version: | %$VERSION% |
| Change History: | <!-- versions below in reverse order -->&nbsp; |
| Nov 2009: | Initial public release |
| Dependencies: | %$DEPENDENCIES% |
| Plugin Home: | http://Foswiki.org/Extensions/FlotChartPlugin |
| Feedback: | http://Foswiki.org/Support/FlotChartPlugin |


<!-- Do _not_ attempt to edit this topic; it is auto-generated. Please add comments/questions/remarks to the feedback topic on Foswiki.org instead. -->

%META:FILEATTACHMENT{name="FoswikiStatsPlugin.png" attr="h" comment="" date="1202302161" path="FoswikiStatsPlugin.png" size="51749" user="WikiContributor" version="1"}%
%META:FILEATTACHMENT{name="wikiringlogo20x20.png" attr="r" comment="" date="1202302161" path="wikiringlogo20x20.png" size="1343" user="WikiContributor" version="1"}%
234 changes: 234 additions & 0 deletions lib/Foswiki/Plugins/FlotChartPlugin.pm
@@ -0,0 +1,234 @@
# Plugin for Foswiki Collaboration Platform, http://Foswiki.org/
#
# (c)opyright SvenDowideit@fosiki.com
#
# This program is free software; you can redistribute it and/or
# modify it under the terms of the GNU General Public License
# as published by the Free Software Foundation; either version 2
# of the License, or (at your option) any later version.
#
# This program is distributed in the hope that it will be useful,
# but WITHOUT ANY WARRANTY; without even the implied warranty of
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
# GNU General Public License for more details, published at
# http://www.gnu.org/copyleft/gpl.html

package Foswiki::Plugins::FlotChartPlugin;

use strict;
require Foswiki::Func; # The plugins API
require Foswiki::Plugins; # For the API version

use vars
qw( $VERSION $RELEASE $SHORTDESCRIPTION $pluginName $NO_PREFS_IN_TOPIC
$doneInit
$ChartId
$mixedAlphaNum
);

$VERSION = '$Rev$';
$RELEASE = '1.1';
$SHORTDESCRIPTION = 'A JQuery based CHARTs for Foswiki';
$NO_PREFS_IN_TOPIC = 1;

# Name of this Plugin, only used in this module
$pluginName = 'FlotChartPlugin';


###############################################################################
sub initPlugin {

# check for Plugins.pm versions
if ( $Foswiki::Plugins::VERSION < 1.026 ) {
Foswiki::Func::writeWarning(
"Version mismatch between $pluginName and Plugins.pm");
return 0;
}

# register new tags
Foswiki::Func::registerTagHandler( 'FLOTCHART', \&_FLOTCHART );

$doneInit = 0;

return 1;
}

###############################################################################
sub doInit {
return if $doneInit;
$doneInit = 1;

# init global vars
$ChartId = 0;
$mixedAlphaNum = Foswiki::Func::getRegularExpression('mixedAlphaNum');

# add the initialisation javascript
my $jscript = Foswiki::Func::readTemplate( lc($pluginName), 'javascript' );
Foswiki::Func::addToHEAD( $pluginName . '-javascript', $jscript );

}

###############################################################################
sub expandVariables {
my ($text, %params) = @_;

return 0 unless $text;

my $found = 0;

foreach my $key (keys %params) {
$found = 1 if $text =~ s/\$$key\b/$params{$key}/g;
}

$found = 1 if $text =~ s/\$percnt/\%/go;
$found = 1 if $text =~ s/\$nop//go;
$found = 1 if $text =~ s/\$n([^$mixedAlphaNum]|$)/\n$1/go;
$found = 1 if $text =~ s/\$dollar/\$/go;

$_[0] = $text if $found;

return $found;
}

###############################################################################
sub _FLOTCHART {
my ( $session, $params, $topic, $web ) = @_;

doInit();

my $seriesNames = $params->{_DEFAULT} || $params->{series};
return unless ( defined($seriesNames) );

# populate series hash
my %seriesData;
foreach my $name (split( /,/, $seriesNames )) {
$name =~ s/^\s+//go;
$name =~ s/\s+$//go;
my $data = $params->{$name};
next unless $data;
$data = Foswiki::Func::expandCommonVariables($data, $topic, $web)
if expandVariables($data);
$seriesData{$name} = $data;
}

# create the plot options
my @plotOptions = ();
my $val;

# xaxis
my @xAxisOptions = ();
$val = $params->{xticks}; push @xAxisOptions, "ticks: [$val ]" if defined $val;
$val = $params->{xmin}; push @xAxisOptions, "min: $val" if defined $val;
$val = $params->{xmax}; push @xAxisOptions, "max: $val" if defined $val;
$val = $params->{xmode}; push @xAxisOptions, "mode: '$val'" if defined $val;
$val = $params->{xmargin}; push @xAxisOptions, "autoscaleMargin: $val" if defined $val;

push @plotOptions, "xaxis : {".join(", ",@xAxisOptions)."}"
if @xAxisOptions;

# yaxis
my @yAxisOptions = ();
$val = $params->{yticks}; push @yAxisOptions, "ticks: [$val]" if defined $val;
$val = $params->{ymin}; push @yAxisOptions, "min: $val" if defined $val;
$val = $params->{ymax}; push @yAxisOptions, "max: $val" if defined $val;
$val = $params->{ymode}; push @yAxisOptions, "mode: '$val'" if defined $val;
$val = $params->{ymargin}; push @yAxisOptions, "autoscaleMargin: $val" if defined $val;

push @plotOptions, "yaxis : {".join(", ",@yAxisOptions)."}"
if @yAxisOptions;

my $options;
$options = getOptions($params, 'points'); push @plotOptions, $options if $options;
$options = getOptions($params, 'lines'); push @plotOptions, $options if $options;
$options = getOptions($params, 'bars'); push @plotOptions, $options if $options;

# canvas options
my $width = $params->{width} || 'auto';
my $height = $params->{height} || '300px';

# gather series data
my @jsVars = ();
my @flotData = ();
foreach my $name ( keys(%seriesData) ) {
push @jsVars, "var $name = [${seriesData{$name}}];";
my @seriesOptions = ();
my $label = $params->{"${name}_label"} || $name;
push @seriesOptions, "data: $name";
push @seriesOptions, "label : '$label'";

my $options;
$options = getOptions($params, 'points', $name); push @seriesOptions, $options if $options;
$options = getOptions($params, 'lines', $name); push @seriesOptions, $options if $options;
$options = getOptions($params, 'bars', $name); push @seriesOptions, $options if $options;


push @flotData, '{ ' . join(', ', @seriesOptions) . ' }';
}

my $jsVars = join("\n", @jsVars);
my $flotData = join(",\n", @flotData);
my $plotOptions = join(",\n", @plotOptions);

$ChartId++;

# format result
my $result = <<'EOS';
<script id="flotChartSource%CHARTID%" language="javascript" type="text/javascript">
$(function () {
%SERIES%
var options = { %OPTIONS% };
$.plot($("#flotChartPlaceholder%CHARTID%"), [ %SERIESNAMES% ], options);
});
</script>
EOS
$result =~ s/%SERIES%/$jsVars/g;
$result =~ s/%SERIESNAMES%/$flotData/g;
$result =~ s/%OPTIONS%/$plotOptions/g;
$result =~ s/%CHARTID%/$ChartId/g;
$result =~ s/%WIDTH%/$width/g;
$result =~ s/%HEIGHT%/$height/g;
Foswiki::Func::addToHEAD("$pluginName - flotChart $ChartId", $result );

$result = <<'EOS';
<div class="flotChart" id="flotChartPlaceholder%CHARTID%" style="margin-top:1em;width:%WIDTH%;height:%HEIGHT%;"></div>
EOS
$result =~ s/%SERIES%/$jsVars/g;
$result =~ s/%SERIESNAMES%/$flotData/g;
$result =~ s/%OPTIONS%/$plotOptions/g;
$result =~ s/%CHARTID%/$ChartId/g;
$result =~ s/%WIDTH%/$width/g;
$result =~ s/%HEIGHT%/$height/g;
$result =~ s/\s+$//go;

return $result;
}

###############################################################################
sub getOptions {
my ($params, $type, $name) = @_;

$name ||= '';

my $sep = $name?'_':'';
my @options = ();
my $val;

$val = $params->{"${name}$sep${type}"}; push @options, "show: $val" if defined $val;
$val = $params->{"${name}$sep${type}width"}; push @options, "lineWidth: $val" if defined $val;
$val = $params->{"${name}$sep${type}fill"}; push @options, "fill: $val" if defined $val;
$val = $params->{"${name}$sep${type}fillcolor"}; push @options, "fillColor: $val" if defined $val;
$val = $params->{"${name}$sep${type}shadow"}; push @options, "shadowSize: $val" if defined $val;

if ($type eq 'points') {
$val = $params->{"${name}$sep${type}radius"}; push @options, "radius: $val" if defined $val;
}

if ($type eq 'bars') {
$val = $params->{"${name}$sep${type}width"}; push @options, "barWidth: $val" if defined $val;
}

return undef unless @options;
return "$type : { ".join(', ', @options)." }";
}

1;
5 changes: 5 additions & 0 deletions lib/Foswiki/Plugins/FlotChartPlugin/DEPENDENCIES
@@ -0,0 +1,5 @@
# Dependencies for FlotChartPlugin
# Example:
# Time::ParseDate,>=2003.0211,cpan,Required.
# TWiki::Plugins,>=1.15,perl,TWiki 4.1 release.

0 comments on commit c93ec95

Please sign in to comment.