The following document is the user guide for web app.


alt text

After login, the app shows a home console with the following sections:


alt text

Sheets menu contains all the user’s owned sheets. It also has some additional options for managing sheets.

New Sheet button is used to create new sheet.


alt text

Profile menu contains user’s detailed information including subscription information.


A NxSheet spreadsheet or sheet is basically a spreadsheet that allows users to write javascripts and apply them to target cells or ranges. It has two (2) most important sections upon opening a sheet:


A grid contains many columns and rows. Each column can have labels from A to Z, and each row has a numeric index number. Within the grid are the cells. Each cell can contain either text, number, formula, or function. A formula or a function within the cell starts with = sign.

A javascript function call is possible within this app.

If the following method is defined, a cell with the content = foo() will have the value Hello World.

function foo(){
  return 'Hello World';


A notebook consists of multiple notes. Upon loading a sheet, all notes will be loaded based on the notes’ orders.


A note has 3 different sections:

Besides the above sections, a note has 2 other buttons resided top right corner: note type and options

Note type defines the note type. It has one of the following types:

Markdown and HTML translated code will be updated live while typing.

Options button provide additional note options as followed:

Current note is the note that is being focused. Clicking away from the current note will replay its content.


Shortcuts are recommended to use while editing notes since it provides great flexibility for moving between different notes.


Charting is a unique and important feature in this app. There’s a built-in wrapper on top of Highcharts that make charting quick and easy. The following charts are supported:

A detailed example can be accessed here .

Syntax & Usage

Syntax: Charts.ChartType( dataRange, options )

All charts are part of Charts class. A chart call requires a data range string and an optional options. Multiple ranges can be specified within the same string using commas. For example:

dataRange can be one of the following formats:

options object variable contains has following optional attributes:

xAxis & yAxis must contain the exact column strings. Any extra spaces in the name will be consider as different column. If xAxis and yAxis are not spicified, the 1st column and 2nd column will be chosen fir the axises accordingly .

For Pie chart, xAxis is used as 'Categories’ column and yAxis is used as 'Values’ column. A pie chart only takes a single dataset.

Example of a simple chart call:


Drawing multi-dataset charts

Drawing multi-dataset charts is possible by specifying mutiple data ranges or axises. If all datasets share the same data range block, a single data range can used concurrently with multiple xAxises and yAxises.

Drawing on grid

A chart can be drawn directly on the sheet grid. A GridView element needs to be first initialized using NxSheet.GridView class constructor. It has the following optional attributes:

Full example

The following is a full example of multi-bar chart extracted from the example above:

el = new NxSheet.GridView({
  id: 'chart',
  className: 'bar-chart',
  pos: {x: 20, y: 200},
  css: {width: 510, height: 280},
  draggable: false,
  clear: true

options = {
  el: el,
  name: ["< 5", "5-13","14-17","18-24","25-44","45-64","65+"],
  label: ["Multi-bar chart", "xAxis label", 'yAxis label'],
  xAxis: "State",
  yAxis: ["Under 5 Years","14 to 17 Years","18 to 24 Years","25 to 44 Years","45 to 64 Years","65 Years and Over"],
  showLegend: false

Charts.Bar('A1:H7', options);

Util functions

This app doesn’t limit one’s ability to perform any further complex charting functions. Users can use any external chart libraries instead of the above charting wrapper. The following functions can be useful for this purpose:


Sheet settings are important to a particular sheet. All settings are placed under Settings tab. This tab allow users to control external libraries, tags, privacy, and more.

External Libraries

This gives the ability to load external javascript libraries before loading the sheet grid data. External function calls can be used directly in the grid cells or within the javascript notes.


A sheet can have the following type of privacy:


Tags are useful feature that allows users to find related sheets within similar categories. A publically shared sheet should have tags.


This describes the sheet data and anything related to the sheet. It’s a good idea to provide sheet description for any publically exposed sheets. This would help the search engine to find the best fit sheet within the system.

Additional Resources


For immediate help or feedback, please send an email to

Tutorials and videos

(Work in progress)


How large a sheet can be?

This app supports a maximum of 100,000 rows and 1,000,000 cells.

Can I use Highcharts or other charting libraries besides the built in one?

Yes, you can. You can utilize the Util functions to accomplish this.