Change Axis Properties

To alter the appearance of chart axes, use the Chart’s EGraph.setScale(field, scale) method to assign a new Scale object. For example, you can replace a linear scale with a logarithmic scale, show or hide tick marks, display axis labels at top or right, change the label font and color, etc.

Consider the following Chart component script:

dataset = [["State","Quantity"], ["NJ",200], ["NY",3000]];
graph = new EGraph();
var elem = new IntervalElement("State", "Quantity");
graph.addElement(elem);
Script that modifies the graph or dataset properties should be placed on the Chart component itself. See Add Component Script for more information. This script has access to the Chart data and Chart API methods. Scripted Charts are not good candidates for user-modification, so you should deselect ‘Enable Ad Hoc Editing’ in the Chart Properties dialog box.

setScaleExample

This creates a basic bar chart displaying the dimensions ‘State’ and ‘Quantity’. Follow the steps below to experiment with modifying the chart’s axes:

  1. Create a new logarithmic scale using the LogScale object, specifying ‘Quantity’ as the field on which the scale is based.

    var logscale = new LogScale('Quantity');
  2. Set the color of the Y-axis lines and gridline to blue, and make the gridlines dotted. To do this, create a new AxisSpec object, and assign it to the Scale.

    var yspec = new AxisSpec();
    yspec.setLineColor(java.awt.Color(0x0000ff));
    yspec.setGridColor(java.awt.Color(0x0000ff));
    yspec.setGridStyle(Chart.DOT_LINE);
    logscale.setAxisSpec(yspec);
  3. Create a new CategoricalScale for the X-axis, specifying ‘State’ as the field on which the scale is based.

    var cscale = new CategoricalScale('State');
  4. Remove the X-axis lines and tick marks. To do this, create a new AxisSpec object, and assign it to the Scale.

    var xspec = new AxisSpec();
    xspec.setLineVisible(false);
    xspec.setTickVisible(false);
    cscale.setAxisSpec(xspec);
  5. Move the X-axis labels above the chart area, and increase their size. To do this, create a new TextSpec object, and assign it to the AxisSpec.

    var tspec = new TextSpec();
    tspec.setFont(java.awt.Font('Dialog', java.awt.Font.BOLD, 14));
    xspec.setTextSpec(tspec);
    xspec.setAxisStyle(AxisSpec.AXIS_SINGLE2);
  6. Create a new TextFrame, and specify new axis labels to replace the default labels (‘NJ’, ‘NY’) with the full state names. Assign the new TextFrame to the AxisSpec object.

    var tframe = new DefaultTextFrame();
    tframe.setText('NJ','New Jersey');
    tframe.setText('NY','New York');
    xspec.setTextFrame(tframe);
  7. Assign the two Scale objects to the appropriate axes of the graph object.

    graph.setScale('Quantity',logscale);
    graph.setScale('State',cscale);

    setScaleExampleFinal

Complete Script
dataset = [["State","Quantity"], ["NJ",200], ["NY",3000]];
graph = new EGraph();
var elem = new IntervalElement("State", "Quantity");
var logscale = new LogScale('Quantity');
var yspec = new AxisSpec();
yspec.setLineColor(java.awt.Color(0x0000ff));
yspec.setGridColor(java.awt.Color(0x0000ff));
yspec.setGridStyle(Chart.DOT_LINE);
logscale.setAxisSpec(yspec);
var cscale = new CategoricalScale('State');
var xspec = new AxisSpec();
xspec.setLineVisible(false);
xspec.setTickVisible(false);
cscale.setAxisSpec(xspec);
var tspec = new TextSpec();
tspec.setFont(java.awt.Font('Dialog',java.awt.Font.BOLD, 14));
xspec.setTextSpec(tspec);
xspec.setAxisStyle(AxisSpec.AXIS_SINGLE2);
var tframe = new DefaultTextFrame();
tframe.setText('NJ','New Jersey');
tframe.setText('NY','New York');
xspec.setTextFrame(tframe);
graph.setScale('Quantity',logscale);
graph.setScale('State',cscale);
graph.addElement(elem);

To change properties on a Chart that was previously created with the Chart Editor, use “getter” methods such as EGraph.getCoordinate() ① and RectCoord.getYScale2() ② to obtain a handle to the desired Coordinate object, Scale object, and so on. For example:

var coord = graph.getCoordinate(); (1)
var yscale = coord.getYScale(); (2)
// Compact syntax: var yscale = graph.getCoordinate().getYScale();

var yspec = new AxisSpec();
yspec.setLineColor(java.awt.Color(0x0000ff));
yspec.setGridColor(java.awt.Color(0x0000ff));
yspec.setGridStyle(Chart.DOT_LINE);
yscale.setAxisSpec(yspec);
var xscale = coord.getXScale();
var xspec = new AxisSpec();
xspec.setLineVisible(false);
xspec.setTickVisible(false);
var tspec = new TextSpec();
tspec.setFont(java.awt.Font('Dialog',java.awt.Font.BOLD, 14)); xspec.setTextSpec(tspec);
xspec.setAxisStyle(AxisSpec.AXIS_SINGLE2);
xscale.setAxisSpec(xspec);