Media rules allow for the creation of responsive charts by changing how the chart and its various objects appear at different breakpoints (or chart dimensions). You can create media rules based on the width and/or height of the chart. Try interacting with the following chart. Refer to the Media Rules Tutorial for more information.

Attribute	Type	Description
alpha	Number	Sets the opacity on the marker, with 0 being fully transparent and 1 being fully opaque. Note that decimal value requires the leading 0. Default Value: 1
backgroundColor background-color	String	Sets the background color of the object. Colors can be entered by name (e.g., "purple", "blue"), hexadecimal notation (e.g., "#666699", #33ccff"), or RGB notation (e.g., "rgb(255,0,0)", "rgb(0,0,255)") Default Value: null
class	String	Sets a class value on the object. Default Value: null
dataN data-n	Any	Prefix attribute or array using "data-" to define a custom token.
id	String	Sets the id of the object. Default Value: ''
lineColor line-color	String	Sets the line color of the object, applicable on non-closed shapes. See also border-color for closed shapes. Default Value: '#000'
lineStyle line-style	String	Sets the line style of the object. Accepted Values: ['dashdot', 'dashed', 'dotted', 'solid'] Default Value: ''
lineWidth line-width	Number	Sets the line width of the object, applicable on non-closed shapes. See also border-width for closed shapes. Default Value: 0
maxHeight max-height	Number	Sets the maximum chart height in pixels. Introduced in: v2.4.1
maxWidth max-width	Number	Sets the maximum chart width in pixels. Introduced in: v2.4.1
minHeight min-height	Number	Sets the minimum chart height in pixels. Introduced in: v2.4.1
minWidth min-width	Number	Sets the minimum chart width in pixels. Introduced in: v2.4.1
shadow	Boolean	Sets whether the object's shadow is visible or not. Has limited effect on HTML5 implementation. Default Value: false
shadowAlpha shadow-alpha	Number	Sets the transparency of the shadow of the object. The higher the value, the less transparent the shadow will be. Default Value: 0.75
shadowAngle shadow-angle	Number	Sets the angle of the shadow underneath the object. Default Value: 45
shadowBlur shadow-blur	Number	Sets the blur effect size for the shadow of the object. Has limited effect on HTML5 implementation. Default Value: 0
shadowColor shadow-color	String	Sets the color of the shadow of the object. Default Value: '#999'
shadowDistance shadow-distance	Number	Sets the distance between the shadow and the object. Default Value: 2
visible	Boolean	Sets the visibility of the object. Allows you to turn off the object without removing lines of JSON.