OFFSET function
PRO
The OFFSET function in Jspreadsheet Formulas Pro is a useful tool that allows you to reference a range of cells that is a certain distance away from a starting cell or range. This distance, or 'offset', is defined by you. For example, you might use OFFSET to reference the cell that's 3 rows down and 2 columns to the right of your starting cell. It's like giving directions from one cell to another.
Documentation
Returns a reference to a range that is offset from a starting cell or range.
Category
Lookup and reference
Syntax
OFFSET(reference, rows, cols, [height], [width])
| Parameter | Description |
|---|---|
reference |
The starting point from which you want to base the offset. |
rows |
The number of rows, up (negative value) or down (positive value), by which the resulting range should be offset. |
cols |
The number of columns, to the left (negative value) or right (positive value), by which the resulting range should be offset. |
[height] |
Optional. Argument that specifies the height, in number of rows, that you want the resulting range to be. |
[width] |
Optional. Argument that specifies the width, in number of columns, that you want the resulting range to be. |
Behavior
The OFFSET function returns a cell or range of cells that is a specified number of rows and columns from a cell or range of cells. Here's how it handles various inputs:
-
Empty Cells: If the
OFFSETfunction references empty cells, it will return an empty cell. The return type ofOFFSETwill depend on the content of the cell it returns. If the cell is empty,OFFSETreturns a zero for numeric cells and an empty string for string cells. -
Text: If the
OFFSETfunction references a cell containing text, it returns that text. -
Booleans: If the
OFFSETfunction references a cell containing a Boolean value, it returns that Boolean value. -
Errors: If the
OFFSETfunction references a cell containing an error, it returns that error. -
Non-existent cells: If the
OFFSETfunction is directed towards a cell that doesn't exist (like row 0 or column 0), it will return a#REF!error.
Common Errors
| Error | Description |
|---|---|
| #REF! | This error can also occur if the OFFSET function returns a cell reference outside the available spreadsheet grid. |
| #VALUE! | This error is returned if the OFFSET function is given argument values that aren't valid. For example, if the row or column offset, or the height or width arguments, are non-numeric. |
Best practices
- Always ensure that the
OFFSETfunction isn't referencing non-existent cells. This includes avoiding referencing cells in row 0, column 0, or beyond the maximum row and column limits.- Use the
OFFSETfunction with caution in large spreadsheets, as it can significantly slow down the calculation time. This is becauseOFFSETis a volatile function, meaning it recalculates every time any cell in the spreadsheet changes.- If you are using the
OFFSETfunction to create dynamic ranges, consider using theINDEXfunction instead to improve performance.INDEXis non-volatile and does not force unnecessary calculations.- Be careful when using the
OFFSETfunction with other functions, as it can return arrays or single values depending on its usage, which may affect the behavior of the other functions.
Usage
A few examples using the OFFSET function.
OFFSET(A1,2,2) returns a reference to the cell in the second row and second column relative to cell A1
OFFSET(A1:B5,1,1,1,1) returns a reference to the cell in the second row and second column of the range A2:B3
OFFSET(A1,0,0,3,3) returns a reference to a 3x3 range starting with cell A1
Interactive Spreadsheet Demo
<html>
<script src="https://jspreadsheet.com/v11/jspreadsheet.js"></script>
<script src="https://jsuites.net/v5/jsuites.js"></script>
<link rel="stylesheet" href="https://jsuites.net/v5/jsuites.css" type="text/css" />
<link rel="stylesheet" href="https://jspreadsheet.com/v11/jspreadsheet.css" type="text/css" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Material+Icons" />
<script src="https://cdn.jsdelivr.net/npm/@jspreadsheet/formula-pro/dist/index.min.js"></script>
<div id="spreadsheet"></div>
<script>
// Set your JSS license key (The following key only works for one day)
jspreadsheet.setLicense('NDFmYzc2ZTU2MWY1ZmMzZjY3OGIwM2MxMzYzMGFiZTEwYmIyNzdiNWY3NTNkZThiMjA1MTI3ODI1MTc0YTRkZDcwMGJmNTEzYjAwMjBlMDUzNzY0ODA1OGQyNWRmMWI2ZGQ3M2M5ZThmMzA1NWRiMWMxZGM1OGJhN2EyZDJjNWQsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpZeU1EYzJNVFl4TENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0p6ZEdGamEySnNhWFI2TG1sdklpd2lkMlZpWTI5dWRHRnBibVZ5TG1sdklpd2liRzlqWVd4b2IzTjBJbDBzSW5Cc1lXNGlPaUl6TkNJc0luTmpiM0JsSWpwYkluWTNJaXdpZGpnaUxDSjJPU0lzSW5ZeE1DSXNJbll4TVNJc0ltTm9ZWEowY3lJc0ltWnZjbTF6SWl3aVptOXliWFZzWVNJc0luQmhjbk5sY2lJc0luSmxibVJsY2lJc0ltTnZiVzFsYm5Seklpd2lhVzF3YjNKMFpYSWlMQ0ppWVhJaUxDSjJZV3hwWkdGMGFXOXVjeUlzSW5ObFlYSmphQ0lzSW5CeWFXNTBJaXdpYzJobFpYUnpJaXdpWTJ4cFpXNTBJaXdpYzJWeWRtVnlJaXdpYzJoaGNHVnpJaXdpWm05eWJXRjBJbDBzSW1SbGJXOGlPblJ5ZFdWOQ==');
// Set the extensions
jspreadsheet.setExtensions({ formula });
// Create a new spreadsheet
jspreadsheet(document.getElementById('spreadsheet'), {
worksheets: [{
data: [
[
"Product",
"Jan",
"Feb",
"Mar"
],
[
"Apples",
100,
150,
200
],
[
"Bananas",
80,
120,
160
],
[
"Oranges",
90,
110,
180
],
[
"Q1 Total:",
"=SUM(OFFSET(B1,1,0,3,1))",
"=SUM(OFFSET(C1,1,0,3,1))",
"=SUM(OFFSET(D1,1,0,3,1))"
]
]
}]
});
</script>
</html>
import React, { useRef } from "react";
import { Spreadsheet, Worksheet, jspreadsheet } from "@jspreadsheet/react";
import formula from "@jspreadsheet/formula-pro";
import "jsuites/dist/jsuites.css";
import "jspreadsheet/dist/jspreadsheet.css";
// Set license
jspreadsheet.setLicense('NDFmYzc2ZTU2MWY1ZmMzZjY3OGIwM2MxMzYzMGFiZTEwYmIyNzdiNWY3NTNkZThiMjA1MTI3ODI1MTc0YTRkZDcwMGJmNTEzYjAwMjBlMDUzNzY0ODA1OGQyNWRmMWI2ZGQ3M2M5ZThmMzA1NWRiMWMxZGM1OGJhN2EyZDJjNWQsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpZeU1EYzJNVFl4TENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0p6ZEdGamEySnNhWFI2TG1sdklpd2lkMlZpWTI5dWRHRnBibVZ5TG1sdklpd2liRzlqWVd4b2IzTjBJbDBzSW5Cc1lXNGlPaUl6TkNJc0luTmpiM0JsSWpwYkluWTNJaXdpZGpnaUxDSjJPU0lzSW5ZeE1DSXNJbll4TVNJc0ltTm9ZWEowY3lJc0ltWnZjbTF6SWl3aVptOXliWFZzWVNJc0luQmhjbk5sY2lJc0luSmxibVJsY2lJc0ltTnZiVzFsYm5Seklpd2lhVzF3YjNKMFpYSWlMQ0ppWVhJaUxDSjJZV3hwWkdGMGFXOXVjeUlzSW5ObFlYSmphQ0lzSW5CeWFXNTBJaXdpYzJobFpYUnpJaXdpWTJ4cFpXNTBJaXdpYzJWeWRtVnlJaXdpYzJoaGNHVnpJaXdpWm05eWJXRjBJbDBzSW1SbGJXOGlPblJ5ZFdWOQ==');
// Set the extensions
jspreadsheet.setExtensions({ formula });
export default function App() {
// Spreadsheet array of worksheets
const spreadsheet = useRef();
// Worksheet data
const data = [
[
"Product",
"Jan",
"Feb",
"Mar"
],
[
"Apples",
100,
150,
200
],
[
"Bananas",
80,
120,
160
],
[
"Oranges",
90,
110,
180
],
[
"Q1 Total:",
"=SUM(OFFSET(B1,1,0,3,1))",
"=SUM(OFFSET(C1,1,0,3,1))",
"=SUM(OFFSET(D1,1,0,3,1))"
]
];
// Render component
return (
<Spreadsheet ref={spreadsheet}>
<Worksheet data={data} />
</Spreadsheet>
);
}
<template>
<Spreadsheet ref="spreadsheet">
<Worksheet :data="data" />
</Spreadsheet>
</template>
<script>
import { Spreadsheet, Worksheet, jspreadsheet } from "@jspreadsheet/vue";
import "jsuites/dist/jsuites.css";
import "jspreadsheet/dist/jspreadsheet.css";
import formula from "@jspreadsheet/formula-pro";
// Set license
jspreadsheet.setLicense('NDFmYzc2ZTU2MWY1ZmMzZjY3OGIwM2MxMzYzMGFiZTEwYmIyNzdiNWY3NTNkZThiMjA1MTI3ODI1MTc0YTRkZDcwMGJmNTEzYjAwMjBlMDUzNzY0ODA1OGQyNWRmMWI2ZGQ3M2M5ZThmMzA1NWRiMWMxZGM1OGJhN2EyZDJjNWQsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpZeU1EYzJNVFl4TENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0p6ZEdGamEySnNhWFI2TG1sdklpd2lkMlZpWTI5dWRHRnBibVZ5TG1sdklpd2liRzlqWVd4b2IzTjBJbDBzSW5Cc1lXNGlPaUl6TkNJc0luTmpiM0JsSWpwYkluWTNJaXdpZGpnaUxDSjJPU0lzSW5ZeE1DSXNJbll4TVNJc0ltTm9ZWEowY3lJc0ltWnZjbTF6SWl3aVptOXliWFZzWVNJc0luQmhjbk5sY2lJc0luSmxibVJsY2lJc0ltTnZiVzFsYm5Seklpd2lhVzF3YjNKMFpYSWlMQ0ppWVhJaUxDSjJZV3hwWkdGMGFXOXVjeUlzSW5ObFlYSmphQ0lzSW5CeWFXNTBJaXdpYzJobFpYUnpJaXdpWTJ4cFpXNTBJaXdpYzJWeWRtVnlJaXdpYzJoaGNHVnpJaXdpWm05eWJXRjBJbDBzSW1SbGJXOGlPblJ5ZFdWOQ==');
// Set the extensions
jspreadsheet.setExtensions({ formula });
export default {
components: {
Spreadsheet,
Worksheet,
},
data() {
// Worksheet data
const data = [
[
"Product",
"Jan",
"Feb",
"Mar"
],
[
"Apples",
100,
150,
200
],
[
"Bananas",
80,
120,
160
],
[
"Oranges",
90,
110,
180
],
[
"Q1 Total:",
"=SUM(OFFSET(B1,1,0,3,1))",
"=SUM(OFFSET(C1,1,0,3,1))",
"=SUM(OFFSET(D1,1,0,3,1))"
]
]
return {
data
};
}
}
</script>
import { Component, ViewChild, ElementRef } from "@angular/core";
import jspreadsheet from "jspreadsheet";
import * as formula from "@jspreadsheet/formula-pro";
// Set your JSS license key (The following key only works for one day)
jspreadsheet.setLicense('NDFmYzc2ZTU2MWY1ZmMzZjY3OGIwM2MxMzYzMGFiZTEwYmIyNzdiNWY3NTNkZThiMjA1MTI3ODI1MTc0YTRkZDcwMGJmNTEzYjAwMjBlMDUzNzY0ODA1OGQyNWRmMWI2ZGQ3M2M5ZThmMzA1NWRiMWMxZGM1OGJhN2EyZDJjNWQsZXlKamJHbGxiblJKWkNJNklpSXNJbTVoYldVaU9pSktjM0J5WldGa2MyaGxaWFFpTENKa1lYUmxJam94TnpZeU1EYzJNVFl4TENKa2IyMWhhVzRpT2xzaWFuTndjbVZoWkhOb1pXVjBMbU52YlNJc0ltTnZaR1Z6WVc1a1ltOTRMbWx2SWl3aWFuTm9aV3hzTG01bGRDSXNJbU56WWk1aGNIQWlMQ0p6ZEdGamEySnNhWFI2TG1sdklpd2lkMlZpWTI5dWRHRnBibVZ5TG1sdklpd2liRzlqWVd4b2IzTjBJbDBzSW5Cc1lXNGlPaUl6TkNJc0luTmpiM0JsSWpwYkluWTNJaXdpZGpnaUxDSjJPU0lzSW5ZeE1DSXNJbll4TVNJc0ltTm9ZWEowY3lJc0ltWnZjbTF6SWl3aVptOXliWFZzWVNJc0luQmhjbk5sY2lJc0luSmxibVJsY2lJc0ltTnZiVzFsYm5Seklpd2lhVzF3YjNKMFpYSWlMQ0ppWVhJaUxDSjJZV3hwWkdGMGFXOXVjeUlzSW5ObFlYSmphQ0lzSW5CeWFXNTBJaXdpYzJobFpYUnpJaXdpWTJ4cFpXNTBJaXdpYzJWeWRtVnlJaXdpYzJoaGNHVnpJaXdpWm05eWJXRjBJbDBzSW1SbGJXOGlPblJ5ZFdWOQ==');
// Set the extensions
jspreadsheet.setExtensions({ formula });
@Component({
standalone: true,
selector: "app-root",
template: `<div #spreadsheet></div>`
})
export class AppComponent {
@ViewChild("spreadsheet") spreadsheet: ElementRef;
// Worksheets
worksheets: jspreadsheet.worksheetInstance[];
// Create a new data grid
ngAfterViewInit() {
// Create spreadsheet
this.worksheets = jspreadsheet(this.spreadsheet.nativeElement, {
worksheets: [{
data: [
[
"Product",
"Jan",
"Feb",
"Mar"
],
[
"Apples",
100,
150,
200
],
[
"Bananas",
80,
120,
160
],
[
"Oranges",
90,
110,
180
],
[
"Q1 Total:",
"=SUM(OFFSET(B1,1,0,3,1))",
"=SUM(OFFSET(C1,1,0,3,1))",
"=SUM(OFFSET(D1,1,0,3,1))"
]
]
}]
});
}
}