Skip to content

Commit 0ccda67

Browse files
kanchana-mongodbjeff-allen-mongo
authored andcommitted
DOCSP-15047 Click event for data tables (#458)
* DOCSP-15047 Click event for data tables * DOCSP-15047 updates for feedback * DOCSP-15047 updates for reviewer feedback
1 parent 11a82eb commit 0ccda67

File tree

1 file changed

+29
-3
lines changed

1 file changed

+29
-3
lines changed

source/handle-click-events.txt

Lines changed: 29 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -58,9 +58,9 @@ Payload
5858
-------
5959

6060
You can use the click event payload to construct a custom filter that
61-
you can apply on another chart or charts in your application. The
62-
syntax of the payload object for the callback function looks similar to
63-
the following:
61+
you can apply on other charts in your application. The syntax of the
62+
payload object for the callback function looks similar to the
63+
following:
6464

6565
.. code-block:: sh
6666
:copyable: false
@@ -79,6 +79,8 @@ payload:
7979

8080
chart.addEventListener("click", (payload) => {
8181
"chartId": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
82+
"chartTitle": "This is my chart's title",
83+
"chartDescription": "This is my chart's description",
8284
"event": { // information about the mouse event. For example:
8385
"type": "click", // event type
8486

@@ -175,6 +177,18 @@ contains:
175177
- The ``value`` of the clicked element
176178
- The lower bound for numeric or date binning only
177179

180+
For :ref:`data tables <data-table-ref>`, the Charts Embedding
181+
JavaScript SDK click event handler captures click events for the
182+
following elements:
183+
184+
- Chart title
185+
- Fields that represent the channel data for the clicked element:
186+
187+
- ``groups`` field, which contains all Groups channels including
188+
label and value
189+
- ``cell`` field, which contains the column header label and value of
190+
the clicked cell
191+
178192
.. _click-event-payload-selection-filter:
179193

180194
``selectionFilter`` Element
@@ -226,6 +240,18 @@ contains information about the clicked target including:
226240
- The role of mark, such as ``mark``, ``legend``, ``axis-label``, etc.
227241
- The fill color of the mark
228242

243+
For :ref:`data tables <data-table-ref>`, the Charts Embedding
244+
JavaScript SDK click event handler payload captures the following:
245+
246+
- Mark type, which is ``text``
247+
- Mark role, such as ``group-cell``, ``value-cell``,
248+
``dynamic-value-cell``, ``row-total-cell``,
249+
``column-total-cell``, ``header-column-total-cell``, and
250+
``grand-total-cell``
251+
252+
The Charts Embedding JavaScript SDK click event handler does not
253+
capture click events on column headers.
254+
229255
.. _click-event-egs:
230256

231257
Examples

0 commit comments

Comments
 (0)