diff --git a/docs/guides/configuration.md b/docs/guides/configuration.md index ed4230c..6363375 100644 --- a/docs/guides/configuration.md +++ b/docs/guides/configuration.md @@ -358,51 +358,9 @@ const widget = new pivot.Pivot("#pivot", { }); ~~~ -### Adding columns and rows with total values - -To enable generating the rightmost column with total values, apply the [`tableShape`](/api/config/tableshape-property) property and set the value of the `totalColumn` parameter to **true**. - -To enable generating the footer with total, apply the [`tableShape`](/api/config/tableshape-property)property and set the value of the `totalRow` parameter to **true**. - -Example: - -~~~jsx {2-5} -const widget = new pivot.Pivot("#pivot", { - tableShape: { - totalRow: true, - totalColumn: true, - }, - fields, - data, - config: { - rows: ["studio"], - columns: ["type"], - values: [ - { - field: "score", - method: "max", - }, - { - field: "episodes", - method: "count", - }, - { - field: "rank", - method: "min", - }, - { - field: "members", - method: "sum", - }, - ], - }, -}); -~~~ - ### Setting date format -tbd - +tbd! Pivot uses the following characters for setting the date format: | Character | Definition |Example | @@ -429,6 +387,10 @@ Pivot uses the following characters for setting the date format: To present the 20th of June, 2024 with the exact time as *2024-09-20 16:47:08.128*, specify "%Y-%m-%d-%H:%i:%s.%u". +You can set the date format using the Pivot locale. + + + ### Working with filters The widget allows you to set various filters for fields depending on the type of data. It's possible to specify filters both via the Pivot interface after initialization or through the corresponding API using the [`config`](/api/config/config-property) property. diff --git a/docs/guides/working-with-data.md b/docs/guides/working-with-data.md index 8a62ea7..d771fce 100644 --- a/docs/guides/working-with-data.md +++ b/docs/guides/working-with-data.md @@ -312,7 +312,7 @@ widget.api.intercept("add-field", (ev) => { To add a custom method, use the [`methods`](/api/config/methods-property) property by setting the `key` parameter value to the method name and the `value` parameter should be a function that defines how a method should process data. The function should take an array of numerical values as an input and return a single numerical value. -The example below shows how to calculate the count of unique and average values for the date type. The **countUnique** function takes an array of numbers (values) as an input and calculates the exact count of unique values using the **reduce** method. The **countunique_date** sub-property has a handler with a function that get the unique values from an array of the date values. The **average_date** sub-property has a handler that calculates the average values from an array of the date values. +The example below shows how to calculate the count of unique and average values for the date type. The **countUnique** function takes an array of numbers (values) as an input and calculates the exact count of unique values using the **reduce** method. The **countunique_date** sub-property has a handler with a function that gets the unique values from an array of the date values. The **average_date** sub-property has a handler that calculates the average values from an array of the date values. ~~~jsx {} function countUnique(values, converter) { @@ -460,6 +460,46 @@ const widget = new pivot.Pivot("#pivot", { }); ~~~ +## Adding columns and rows with total values + +To enable generating the rightmost column with total values, apply the [`tableShape`](/api/config/tableshape-property) property and set the value of the `totalColumn` parameter to **true**. + +To enable generating the footer with totals, apply the [`tableShape`](/api/config/tableshape-property)property and set the value of the `totalRow` parameter to **true**. + +Example: + +~~~jsx {2-5} +const widget = new pivot.Pivot("#pivot", { + tableShape: { + totalRow: true, + totalColumn: true, + }, + fields, + data, + config: { + rows: ["studio"], + columns: ["type"], + values: [ + { + field: "score", + method: "max", + }, + { + field: "episodes", + method: "count", + }, + { + field: "rank", + method: "min", + }, + { + field: "members", + method: "sum", + }, + ], + }, +}); +~~~ ## Example