Note: Support for 3D on mobile devices may vary, view the system requirements for more information.

This sample demonstrates how to create a basic Histogram widget. This app displays points in the Indian ocean with estimated temperature values on the sea surface. The histogram visualizes the distribution of features for a given attribute within a specified range.

The histogram can be generated with the histogram() statistics function, then constructed with the fromHistogramResult() convenience method.

const params = {
  layer: layer,
  field: "temp",
  numBins: 100
};

histogram(params)
  .then(function(histogramResult) {

    // Creates a Histogram instance from the returned histogram result
    const histogramWidget = Histogram.fromHistogramResult(
      histogramResult
    );
    histogramWidget.container = "histogram";
  })
  .catch(function(error) {
    console.error(error);
  });

This sample shows how to also add additional options to the histogram.

Open the sandbox and change the attribute value driving the histogram to view different perspectives of this data.

Related Samples

• HistogramRangeSlider
• Update a renderer's data variable
• Customize ColorSlider Histogram