Visual Charts Library for Codename One
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build
dist
lib
nbproject
screenshots
src
README.md
Stubber.jar
build.xml
codenameone_library.properties
manifest.mf
manifest.properties

README.md

#Codename One Charts

A library for creating visual charts in Codename One.

##Synopsis

This library allows you to create visual charts (e.g. bar charts, pie charts, time series charts, line charts, etc..) and embed them in your Codename One application. It was built by wrapping the powerful Flot Javascript library and exposing it's configuration options and methods as a Java API.

##License

LGPL2

##Requirements

Codename One 1.0 or higher

(Previous builds required the CodenameOne Javascript bridge but this requirement has been removed).

##Platform Compatibility

  1. Android. Tested, Works.
  2. Java SE (i.e. in the simulator). Tested, Works
  3. iOS. Should work using both build server and Offline build.
  4. Windows Phone. Not tested, but should work. Please let me know if it doesn't!

##Download

##Installation

Copy the CN1Charts.cn1lib library into your project's lib directory.

##Usage

The general usage of this chart involves:

  1. Create a Chart object which is the model of the chart.
  2. Create a ChartView object with a Chart as its model, and initialize it.
  3. Add the ChartView to the component hierarchy.

E.g. Creating a Pie Chart

Pie Chart

Form hi = new Form("Pie Chart");
hi.setLayout(new BorderLayout());
ChartBuilder b = new ChartBuilder();
Chart chart = b.newPieChart(
        new double[]{10, 22, 45},
        new String[]{"BC", "Alberta", "Saskatchewan"}
);
ChartView v = new ChartView(chart);
v.initLater();
hi.addComponent(BorderLayout.CENTER, v);
hi.show();

E.g. Creating a Bar Chart

Bar Chart

Form hi = new Form("Bar Chart");
hi.setLayout(new BorderLayout());
ChartBuilder b = new ChartBuilder();
Chart chart = b.newBarChart(
        new double[][]{
            {1, 3, 2, 5},
            {3, 1, 2, 4},
            {7, 4, 1, 6},
            {2, 3, 4, 1}
        }, 
        new String[]{"BC", "Alberta", "Ontario", "Saskatchewan"},
        new String[]{"June", "July", "August", "Sept"}
);
ChartView v = new ChartView(chart);
v.initLater();
hi.addComponent(BorderLayout.CENTER, v);
hi.show();

The ChartBuilder class is just a convenience class to build some common types of charts but you can configure your chart using the specific configuration options themselves also:

E.g. Adding multiple Series to a chart, and configuring it to be a pie chart with specific "ticks".

Chart chart = new Chart();
for ( int i=0; i<values.length; i++){
    Series s = newBarChartSeries(values[i], ((double)i)/(values.length+1))
                .label(seriesLabels[i]);
    s.bars().barWidth(1d/(values.length+1));
    chart.addSeries(s);
}


Options opts = new Options();
List<Tick> ticksArr = new ArrayList<Tick>();
for ( int i=0; i<labels.length; i++){
    Tick t = new Tick()
            .label(labels[i])
            .value(new Double(i+0.5));
    ticksArr.add(t);
}

Axis xAxis = new Axis()
        .ticksArr(ticksArr);
List<Axis> xAxes = new ArrayList<Axis>();
xAxes.add(xAxis);
opts.xAxes(xAxes);

chart.options(opts);
return chart;

Most configuration options for Flot have been wrapped in a Java API so you should be able to look at examples of the Flot javascript library and translate them directly to the Java API.

##Documentation

##Contact

Steve Hannah @shannah78