Web/API/MediaSettingsRange

This is an experimental technologyCheck the Browser compatibility table carefully before using this in production.

The MediaSettingsRange interface of the the MediaStream Image Capture API provides the possible range and value size of PhotoCapabilities.imageHeight and PhotoCapabilities.imageWidth. A PhotoCapabilities object can be retrieved by calling ImageCapture.PhotoCapabilities().

Properties

MediaSettingsRange.max

Returns the maximum value of this settings.

MediaSettingsRange.min

Returns the minimum value of this setting.

MediaSettingsRange.step

Returns the minimum difference between consecutive values of this setting.

Example

The following example, extracted from Chrome's Image Capture / Photo Resolution Sample, uses the results from getPhotoCapabilities().imageWidth to modify the size of an input range.  

const input = document.querySelector('input[type="range"]');

var imageCapture;

navigator.mediaDevices.getUserMedia({video: true})
.then(mediaStream => {
  document.querySelector('video').srcObject = mediaStream;

  const track = mediaStream.getVideoTracks()[0];
  imageCapture = new ImageCapture(track);

  return imageCapture.getPhotoCapabilities();
})
.then(photoCapabilities => {
  const settings = imageCapture.track.getSettings();

  input.min = photoCapabilities.imageWidth.min;
  input.max = photoCapabilities.imageWidth.max;
  input.step = photoCapabilities.imageWidth.step;

  return imageCapture.getPhotoSettings();
})
.then(photoSettings => {
  input.value = photoSettings.imageWidth;
})
.catch(error => console.log('Argh!', error.name || error));

Specifications

Specification	Status	Comment
MediaStream Image CaptureThe definition of 'MediaSettingsRange' in that specification.	Working Draft	Initial definition.

Browser compatibility

The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
MediaSettingsRange Experimental'	Chrome Full support 59	Edge Full support ≤79	Firefox ?	IE No support No	Opera Full support 46	Safari ?	WebView Android Full support 59	Chrome Android Full support 59	Firefox Android ?	Opera Android Full support 43	Safari iOS ?	Samsung Internet Android Full support 7.0
max Experimental'	Chrome Full support 59	Edge Full support ≤79	Firefox ?	IE No support No	Opera Full support 46	Safari ?	WebView Android Full support 59	Chrome Android Full support 59	Firefox Android ?	Opera Android Full support 43	Safari iOS ?	Samsung Internet Android Full support 7.0
min Experimental'	Chrome Full support 59	Edge Full support ≤79	Firefox ?	IE No support No	Opera Full support 46	Safari ?	WebView Android Full support 59	Chrome Android Full support 59	Firefox Android ?	Opera Android Full support 43	Safari iOS ?	Samsung Internet Android Full support 7.0
step Experimental'	Chrome Full support 59	Edge Full support ≤79	Firefox ?	IE No support No	Opera Full support 46	Safari ?	WebView Android Full support 59	Chrome Android Full support 59	Firefox Android ?	Opera Android Full support 43	Safari iOS ?	Samsung Internet Android Full support 7.0

Legend

Full support  

Full support

No support  

No support

Compatibility unknown  

Compatibility unknown

Experimental. Expect behavior to change in the future.'

Experimental. Expect behavior to change in the future.

MediaSettingsRange by Mozilla Contributors is licensed under CC-BY-SA 2.5.