Skip to content

Commit fef8d8d

Browse files
authored
(DOCSP-14016) Refactor customization docs (#452)
* Standardize headings * Break geospatial customization options out to individual pages * Fixes * Addressing feedback * wip * wip * resize menu screenshots * Integrate new section after merge
1 parent e6fee8e commit fef8d8d

21 files changed

+442
-379
lines changed

source/chart-type-reference/choropleth.txt

Lines changed: 38 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -34,8 +34,8 @@ and your location field value must be one of the 50 states.
3434

3535
.. _choropleth-enc-channels:
3636

37-
Encoding Channels
38-
-----------------
37+
Choropleth Chart Encoding Channels
38+
----------------------------------
3939

4040
Choropleth charts use the following :ref:`encoding channels
4141
<encoding-channels>`:
@@ -89,21 +89,46 @@ A choropleth chart is a good choice to compare:
8989
a high-level comparison, consider using a
9090
:ref:`Data Table <data-table-ref>`.
9191

92-
Limitation
93-
----------
92+
Customization Options
93+
---------------------
9494

95-
The maximum query response size for a choropleth chart is 5000 documents.
95+
The following customization options are specific to choropleth
96+
charts. For general customization options, see :ref:`customize-charts`.
9697

98+
.. include:: /includes/customization/auto-set-viewport.rst
9799

98-
Example
99-
-------
100+
Opacity
101+
~~~~~~~
102+
103+
The :guilabel:`Opacity` level of a map modifies the degree to which
104+
the chart's map data shows through the data point markers.
105+
106+
Choropleth charts default to ``100%``.
107+
108+
Custom Color Palette
109+
~~~~~~~~~~~~~~~~~~~~
110+
111+
The color palette specifies the range of colors that corresponds to
112+
relative aggregated values in your map. Choropleth charts use a
113+
gradient color picker.
114+
115+
To enable palette customization, toggle the
116+
:guilabel:`Custom Color Palette` switch in the :guilabel:`General`
117+
section.
118+
119+
For more information, see :ref:`Color Palette Customization
120+
<color-palette-customization>`.
121+
122+
Examples
123+
--------
100124

101125
The following choropleth chart visualizes the total count of
102126
movie releases across various countries. Each document in the
103127
collection contains an array of countries where a particular movie was
104128
released.
105129

106130
.. figure:: /images/charts/geo-type-choropleth.png
131+
:alt: Choropleth example chart
107132

108133
In this chart, we specify a
109134
:ref:`Shape Scheme <choropleth-shape-scheme>` of
@@ -131,6 +156,12 @@ high movie release counts compared with other countries.
131156
their expected values, refer to the
132157
:ref:`Choropleth Regions <choropleth-regions>` page.
133158

159+
Limitations
160+
-----------
161+
162+
The maximum query response size for a choropleth chart is 5000
163+
documents.
164+
134165
.. toctree::
135166
:titlesonly:
136167

source/chart-type-reference/column-bar-chart.txt

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -184,6 +184,17 @@ may be beneficial to use one over the other:
184184
- :ref:`Limit Data <charts-limit-data>`
185185
- :ref:`Bin data <charts-bin-data>`
186186

187+
Customization Options
188+
---------------------
189+
190+
The following customization options are specific to column and bar
191+
charts. To see all available customization options, see
192+
:ref:`customize-charts`.
193+
194+
Show or Hide Data Value Labels
195+
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
196+
197+
.. include:: /includes/customization/show-hide-data-labels.rst
187198

188199
Examples
189200
--------
@@ -286,19 +297,8 @@ shade of green indicates a longer average runtime:
286297
:figwidth: 750px
287298
:alt: Colored Bar Chart Reference
288299

289-
Customization Options
290-
---------------------
291-
292-
The following customization options are specific to column and bar
293-
charts. To see all available customization options, see
294-
:ref:`customize-charts`.
295-
296-
Show or Hide Data Value Labels
297-
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
298-
299-
.. include:: /includes/customization/show-hide-data-labels.rst
300-
301300
Limitations
302301
-----------
303302

304-
The maximum query response size for column and bar charts is 5000 documents.
303+
The maximum query response size for column and bar charts is 5000
304+
documents.

source/chart-type-reference/data-table.txt

Lines changed: 14 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -95,19 +95,20 @@ You can use data tables to show:
9595
exercises categorized by the type of exercise and time of day the
9696
exercised was performed.
9797

98-
99-
Limitations
100-
-----------
101-
102-
The maximum query response size for a data table is 50000 documents.
103-
10498
.. _data-table-example:
10599

106100
Customization Options
107101
---------------------
108102

109-
You have the option to make text which does not fit in a single data cell
110-
wrap across multiple lines. This setting is off by default. To turn it on:
103+
The following customization options are specific to data table charts.
104+
To see all available customization options, see
105+
:ref:`customize-charts`.
106+
107+
Wrap Text
108+
~~~~~~~~~
109+
110+
You can wrap text that does fit in a single data cell across multiple
111+
lines.. This setting is off by default. To turn it on:
111112

112113
1. Select the :guilabel:`Customize` tab of the Chart Builder.
113114
#. Expand the :guilabel:`Fields` section.
@@ -180,6 +181,11 @@ mean weekly price as currency.
180181
Blank table cells indicate that there are no documents that match
181182
the corresponding intersection of ``property_type`` and ``suburb``.
182183

184+
Limitations
185+
-----------
186+
187+
The maximum query response size for a data table is 50000 documents.
188+
183189
.. toctree::
184190
:titlesonly:
185191

source/chart-type-reference/donut-chart.txt

Lines changed: 44 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -87,6 +87,50 @@ Consider using donut charts to display:
8787
values as a proportion to a whole, consider using a
8888
:ref:`column or bar chart <column-bar-chart-ref>`.
8989

90+
Customization Options
91+
---------------------
92+
93+
The following customization options are specific to donut
94+
charts. To see all available customization options, see
95+
:ref:`customize-charts`.
96+
97+
Show or Hide Category Labels
98+
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
99+
100+
You can dictate whether |charts-short| displays text labels for
101+
**categories** in your donut charts.
102+
103+
To set this option:
104+
105+
1. Open the :ref:`Customize <customize-charts>` pane for your chart.
106+
107+
#. In the :guilabel:`General Customization` section, set the
108+
:guilabel:`Data Category Labels` toggle switch to the desired
109+
setting.
110+
111+
.. note::
112+
113+
.. include:: /includes/fact-donut-chart-labels.rst
114+
115+
Show or Hide Data Value Labels
116+
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
117+
118+
.. include:: /includes/customization/show-hide-data-labels.rst
119+
120+
.. _show-hide-data-category-labels:
121+
122+
Show Value or Percentage Labels
123+
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
124+
125+
You can dictate whether a :ref:`Donut Chart <donut-chart-ref>` displays
126+
data values as raw values or percentages. By default, data value labels
127+
show the raw values of your data points. For percentage values in
128+
:ref:`Donut Charts <donut-chart-ref>`, the whole value is the total
129+
value of the entire chart. Percentage labels are always rounded to one
130+
decimal place, and do not adhere to :ref:`Number Formatting
131+
<customize-number-formats>` settings.
132+
133+
.. include:: /includes/customization/show-value-or-percentage-labels.rst
90134

91135
Examples
92136
--------
@@ -164,51 +208,6 @@ segment according to the aggregated value signified in the
164208
:guilabel:`mean` price for all properties rented by the day, week, and
165209
month.
166210

167-
Customization Options
168-
---------------------
169-
170-
The following customization options are specific to donut charts
171-
charts. To see all available customization options, see
172-
:ref:`customize-charts`.
173-
174-
Show or Hide Category Labels
175-
~~~~~~~~~~~~~~~~~~~~~~~~~~~~
176-
177-
You can dictate whether |charts-short| displays text labels for
178-
**categories** in your donut charts.
179-
180-
To set this option:
181-
182-
1. Open the :ref:`Customize <customize-charts>` pane for your chart.
183-
184-
#. In the :guilabel:`General Customization` section, set the
185-
:guilabel:`Data Category Labels` toggle switch to the desired
186-
setting.
187-
188-
.. note::
189-
190-
.. include:: /includes/fact-donut-chart-labels.rst
191-
192-
Show or Hide Data Value Labels
193-
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
194-
195-
.. include:: /includes/customization/show-hide-data-labels.rst
196-
197-
.. _show-hide-data-category-labels:
198-
199-
Show Value or Percentage Labels
200-
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
201-
202-
You can dictate whether a :ref:`Donut Chart <donut-chart-ref>` displays
203-
data values as raw values or percentages. By default, data value labels
204-
show the raw values of your data points. For percentage values in
205-
:ref:`Donut Charts <donut-chart-ref>`, the whole value is the total
206-
value of the entire chart. Percentage labels are always rounded to one
207-
decimal place, and do not adhere to :ref:`Number Formatting
208-
<customize-number-formats>` settings.
209-
210-
.. include:: /includes/customization/show-value-or-percentage-labels.rst
211-
212211
Limitations
213212
-----------
214213

source/chart-type-reference/gauge-chart.txt

Lines changed: 54 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -49,14 +49,64 @@ Gauge charts provide the following :ref:`encoding channels
4949
choose either :guilabel:`Max` or :guilabel:`Min` from the
5050
:guilabel:`Aggregate` dropdown menu.
5151

52+
.. _target-max:
53+
54+
Target and Maximum Interaction
55+
------------------------------
56+
57+
The value encoded in the :guilabel:`Target` channel and the
58+
:guilabel:`Maximum` customization affect each others' behavior. The
59+
followling table explains the effect on the chart of having one, both,
60+
or neither of the values set.
61+
62+
.. list-table::
63+
:header-rows: 1
64+
:widths: 20 20 60
65+
66+
* - Target
67+
- Maximum
68+
- Behavior
69+
70+
* - None
71+
- Default
72+
- No target line. Gauge maximum is the next power of 10 above the value
73+
of the Value channel.
74+
75+
* - None
76+
- Custom
77+
- No target line. Gauge maximum is the specified value.
78+
79+
* - Encoded
80+
- Default
81+
- Target line is rendered. Gauge maximum matches the target value.
82+
83+
* - Encoded
84+
- Custom
85+
- Target line is rendered. Gauge maximum is the specified value.
86+
87+
Use Cases
88+
---------
89+
90+
Gauge charts are useful for displaying a data value represented as a fraction
91+
of a larger value. Gauge charts are a familiar way to represent a situation in
92+
which a container may be either full or empty or somewhere in between.
93+
94+
Consider using gauge charts to represent:
95+
96+
- Occupancy rates in a hotel
97+
98+
- Progress towards a fundraising goal
99+
100+
- The water level in a reservoir
101+
52102
Cutomization Options
53103
--------------------
54104

55105
To access the customization options, click the :guilabel:`Customize` tab
56106
above the encoding channels in the Chart Builder.
57107

58108
.. figure:: /images/charts/customize-tab.png
59-
:figwidth: 200
109+
:figwidth: 251px
60110
:alt: Customization tab
61111

62112
General Customization
@@ -169,66 +219,16 @@ Target Field
169219
the chart.
170220
- None
171221

172-
.. _target-max:
173-
174-
Target and Maximum Interaction
175-
------------------------------
176-
177-
The value encoded in the :guilabel:`Target` channel and the
178-
:guilabel:`Maximum` customization affect each others' behavior. The
179-
followling table explains the effect on the chart of having one, both,
180-
or neither of the values set.
181-
182-
.. list-table::
183-
:header-rows: 1
184-
:widths: 20 20 60
185-
186-
* - Target
187-
- Maximum
188-
- Behavior
189-
190-
* - None
191-
- Default
192-
- No target line. Gauge maximum is the next power of 10 above the value
193-
of the Value channel.
194-
195-
* - None
196-
- Custom
197-
- No target line. Gauge maximum is the specified value.
198-
199-
* - Encoded
200-
- Default
201-
- Target line is rendered. Gauge maximum matches the target value.
202-
203-
* - Encoded
204-
- Custom
205-
- Target line is rendered. Gauge maximum is the specified value.
206-
207-
Use Cases
208-
---------
209-
210-
Gauge charts are useful for displaying a data value represented as a fraction
211-
of a larger value. Gauge charts are a familiar way to represent a situation in
212-
which a container may be either full or empty or somewhere in between.
213-
214-
Consider using gauge charts to represent:
215-
216-
- Occupancy rates in a hotel
217-
218-
- Progress towards a fundraising goal
219-
220-
- The water level in a reservoir
221-
222222
.. _gauge-chart-example:
223223

224-
Example
225-
-------
224+
Examples
225+
--------
226226

227227
The following chart shows progress towards a goal. A clothing retailer has
228228
a goal of selling 100 green shirts per month.
229229

230230
.. figure:: /images/charts/gauge-chart-example.png
231-
:figwidth: 600
231+
:figwidth: 251px
232232
:alt: Gauge chart example
233233

234234
This chart uses a filter to find sales order documents in which the ``item``

0 commit comments

Comments
 (0)