DOCSP-2565: Scatter chart reference

Author: steveren

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

@@ -0,0 +1,129 @@
+.. _scatter-chart-ref:
+
+=======================
+Scatter Chart Reference
+=======================
+
+.. default-domain:: mongodb
+
+.. contents:: On this page
+   :local:
+   :backlinks: none
+   :depth: 1
+   :class: singlecol
+
+Overview
+--------
+
+Scatter charts plot data with individual data points placed along the
+X and Y axes. Optionally, the data point representations may use shapes
+and colors to display additional data dimensions.
+
+Scatter Chart Encoding Channels
+-------------------------------
+
+Scatter charts provide the following :ref:`encoding channels
+<encoding-channels>`:
+
+.. list-table::
+   :header-rows: 1
+   :widths: 20 80
+
+   * - Encoding Channel
+     - Description
+
+   * - X / Y Axis
+     - The X and Y axis encoding channels accept numerical and date
+       fields and display the range of values from the field along the
+       corresponding axis.
+
+   * - Size
+     - *(Optional)* An :guilabel:`aggregation` encoding channel that
+       changes the size of the data point markers, with larger sizes
+       indicating larger aggregated values.
+
+   * - Color
+     - *(Optional)* A :guilabel:`category` encoding channel that changes
+       the color of the data point markers to indicate a corresponding
+       data value. |charts| lists the colors used in a key to the right of
+       the chart.
+
+   * - Shape
+     - *(Optional)* A :guilabel:`category` encoding channel that changes
+       the shape of the data point markers to indicate a corresponding
+       data value. |charts| lists the shapes used in a key to the right of
+       the chart.
+
+Use Cases
+---------
+
+Scatter charts are useful for representing numerical data and
+showing clearly how data points cluster together in certain areas.
+The :guilabel:`Size`, :guilabel:`Color`, and :guilabel:`Shape`
+encoding channels allow you to reveal
+additional trends for data dimensions with low cardinality.
+
+.. tip::
+
+   A chart with many different colors or shapes may result in a
+   cluttered visualization which is difficult to read. You can limit
+   the number of categories in your chart by :ref:`binning
+   <charts-bin-data>` or :ref:`limiting <charts-limit-data>` your data.
+
+Scatter charts show an individual marker for each data point, so
+they work better with smaller result sets. Outliers and extreme data
+points are easy to identify.
+
+Consider using a scatter chart to display:
+
+- Temperature data for selected cities
+- Volume of sales data for selected retail outlets
+- Population density figures across several countries
+
+Examples
+--------
+
+AirBnB Rentals
+~~~~~~~~~~~~~~
+
+The following scatter chart uses a database of information about
+AirBnB rental properties in Sydney, Australia. The X axis shows the
+review ratings given to individual properties, with the price per
+night displayed along the Y axis. The :ref:`query filter
+<charts-filter-documents>` restricts the result set to properties with
+at least 100 reviews.
+
+The chart shows that lower-priced properties have a wider range of
+review scores, while higher-priced properties have a smaller score
+range with generally higher scores.
+
+.. figure:: /images/charts/scatter-chart-airbnb.png
+   :figwidth: 750px
+   :alt: Scatter chart example
+
+Movies with the Most Award Nominations
+~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+The following more complex scatter chart uses a database with movie
+data compiled from IMDb and Rotten Tomatoes. The chart shows the
+TomatoMeter rating (ranging from 0 to 100) of movies with at least
+one award nomination. Each data point marker represents one movie.
+The X axis shows the movie's TomatoMeter rating and the Y axis shows
+the number of award nominations the movie received.
+
+The :ref:`query filter <charts-filter-documents>` restricts the result
+set to exclude marginal data points.
+
+The chart uses the :guilabel:`Color` and :guilabel:`Shape` encoding
+channels to shed further light on the types of movies which receive
+the most award nominations. The color of each data point shows the
+MPAA (Motion Picture Association of America) rating the movie received.
+The chart uses the Shape encoding channel to indicate the year in
+which the movie was released, and :ref:`bins <charts-bin-data>` the
+data to place each movie into a time range, with each bin covering
+25 years. Without the bins, there would be a different shape for every
+year, which would make the chart too noisy to read.
+
+.. figure:: /images/charts/scatter-chart-movie-details.png
+   :figwidth: 750px
+   :alt: Scatter chart example

source/chart-types.txt

@@ -18,3 +18,4 @@ Chart Types
       /chart-type-reference/column-bar-chart
       /chart-type-reference/line-area-chart
       /chart-type-reference/heatmap
+      /chart-type-reference/scatter-chart

source/images/charts/scatter-chart-airbnb.png

@@ -6,3 +6,5 @@ for each chart type in MongoDB Charts:
 - :ref:`Line and Area Chart Reference <line-area-chart-ref>`
 
 - :ref:`Heatmap Reference <heatmap-chart-ref>`
+
+- :ref:`Scatter Chart Reference <scatter-chart-ref>`