Skip to content

Latest commit

 

History

History
128 lines (119 loc) · 28.9 KB

ScatterPlot.md

File metadata and controls

128 lines (119 loc) · 28.9 KB
Raw

ScatterPlot Component

ScatterPlot

Parameter required in graph variable

'mark': {
  'position': {
    'x': {
      'field': 'sepal_length',
    },
    'y': {
      'field': 'sepal_width',
    },
    'z': {
      'field': 'petal_length',
    }
  },
  'type': 'sphere',
  'style': {
    'radius': {
      'scaleType': 'linear',
      'field': 'petal_width',
      'value': [0, 0.2],
    },
    'fill': {
      'scaleType': 'ordinal',
      'opacity': 0.4,
      'field': 'species',
      'color': ['red', 'green', 'blue'],
      'domain': ['setosa', 'versicolor', 'virginica'],
    },
  },
  'droplines': {
    'xz': true,
    'yz': false,
    'xy': false
  },
  'projections': {
    'xz': false,
    'yz': true,
    'xy': true
  }
}

Properties for mark for Prism Map

Property Type Description
type string Defines type of point that would be created. Not Required. Default value: sphere. Available values: box, sphere.
class function Returns the class (html class) for the points as a function of the data. If space in present then the 2 string with space in between will be taken as different classes. Classes cannot begin with a number and nust not contain any special characters expect. This can be used for animating or creating interactions with the points. Not Required.
id function Returns the id (html id) for the points as a function of the data. If space in present then the 2 string with space in between will be taken as different id. ids cannot begin with a number and nust not contain any special characters expect. No 2 ids must be same as id acts as a unique identifier. This can be used for animating or creating interactions with the points. not Required.
position object Defines the how the position of points will be mapped. Required.
position.x object Required.
position.x.field string Defines the field in the data that will be mapped as x position of the points. Required.
position.x.domain float Defines the domain for x position. Not Required. If not present the domain is calculated from the provided data depending on the position.x.scaleType.
position.x.startFromZero boolean Defines if the domain starts from 0 or not. Not Required. Default value: false Only applicable if position.x.domain is not given and position.x.scaleType is linear.
position.y object Required.
position.y.field string Defines the field in the data that will be mapped as y position of the points. Required.
position.y.domain float Defines the domain for y position. Not Required. If not present the domain is calculated from the provided data depending on the position.y.scaleType.
position.y.startFromZero boolean Defines if the domain starts from 0 or not. Not Required. Default value: false.
position.z object Required.
position.z.field string Defines the field in the data that will be mapped as z position of the points. Required.
position.z.domain array Defines the domain for z position. Not Required. If not present the domain is calculated from the provided data depending on the position.z.scaleType.
position.z.startFromZero boolean Defines if the domain starts from 0 or not. Not Required. Default value: false.
style object Defines the style for the points. Required.
style.radius object Defines the radius of the points. Required.
style.radius.scaleType string Defines the scale type for radius of the points. Not Required. If not present then a constant radius that is defined is used. Available values: linear.
style.radius.field string Defines the field in the data that will be mapped as radius of the points. Required if style.radius.scaleType is present.
style.radius.domain array Defines the domain for radius. Not Required. If not present the domain is calculated from the provided data depending on the style.radius.scaleType
style.radius.value array of float or float Defines the range for radius. Not Required. Default value: 0.5. If style.radius.scaleType is not present the style.radius.value is float or else its an array of float.
style.radius.startFromZero boolean Defines if the domain starts from 0 or not. Not Required. Default value: false Only applicable if style.radius.domain is not given and style.radius.scaleType is linear.
style.fill object Defines the fill of the points. Not Required.
style.fill.opacity float Defines the opacity of the points. Not Required. Default value: 1 Value must be between 0 and 1.
style.fill.scaleType string Defines the scale type for fill of the points. Not Required. If not present then a constant color that is defined is filled in the points. Available values: linear or ordinal.
style.fill.field string Defines the field in the data that will be mapped as fill of the points. Required if style.fill.scaleType is present.
style.fill.domain array Defines the domain for fill. Not Required. If not present the domain is calculated from the provided data depending on the style.fill.scaleType
style.fill.color array or string Defines the color for fill. Not Required if style.fill.scaleType is present, else required. Default value: #ff0000 if style.fill.scaleType is not present else d3.schemeCategory10. If style.fill.scaleType is not present the this needs to be a string otherwise an array.
style.fill.startFromZero boolean Defines if the domain starts from 0 or not. Not Required. Default value: false Only applicable if style.fill.color is not given and style.fill.scaleType is linear.
mouseOver.focusedObject object Defines the style for the mouseOver effect on the point. Required.
mouseOver.focusedObject.opacity float Defines the opacity of point when mouse hovers on it. Required.
mouseOver.focusedObject.fill string Defines the color of point when mouse hovers on it. Required.
mouseOver.nonFocusedObject object Defines the style for the point not in focus. Required.
mouseOver.nonFocusedObject.opacity float Defines the opacity of point which are not in focus when mouse hovers on a particular point. Required.
mouseOver.label object Defines the value and style of the mouse over text. Not Required. If not present the label is not shown.
mouseOver.label.value function Returns the value of the text that is to be shown in the label. Required. \n can be used for new line.
mouseOver.label.align string Defines the alignment of the text in the label. Required. Available values: center, left or right.
mouseOver.label.fontColor string Defines the color of the text in the label. Required.
mouseOver.label.lineHeight float Defines the line height of the text in the label. Not Required.
mouseOver.label.wrapCount int Defines the wrap count of the text in the label. Not Required.
mouseOver.label.backgroundColor string Defines the color of the background of the label. Required.
mouseOver.label.backgroundOpacity string Defines the color of the background of the label. Required.
mouseOver.label.position string Defines the position of the label w.r.t the cursor. Not Required. Format is "0 0 0".
mouseOver.label.rotation string Defines the rotation of the label w.r.t the cursor. Not Required. Format is "90 0 0".
mouseOver.label.width float Defines the width of the label. Not Required.
mouseOver.label.height float Defines the height of the label. Not Required.
onClick function Callback function for mouseclick on the shape. Argument of the function is the data binded to the shape. Not Required
droplines object Defines the droplines. Not Required. If not present then a droplines are not drawn.
droplines.xy boolean Defines if the droplines are drawn to the xy plane. Not Required. Default value: false
droplines.yz boolean Defines if the droplines are drawn to the yz plane. Not Required. Default value: false
droplines.xz boolean Defines if the droplines are drawn to the xz plane. Not Required. Default value: false
droplines.style object Defines the style for the droplines. Not Required.
droplines.style.fill object Defines the fill of the droplines. Not Required.
droplines.style.fill.opacity float Defines the opacity of the droplines. Not Required. Default value: 1. Value must be between 0 and 1.
droplines.style.fill.color array or string Defines the color for fill. Not Required. Default value: Matches the color of the dot with which this dropline connects.
projections object Defines the projections. Not Required. If not present then a projections are not drawn.
projections.xy boolean Defines if the projections are drawn to the xy plane. Not Required. Default value: false
projections.yz boolean Defines if the projections are drawn to the yz plane. Not Required. Default value: false
projections.xz boolean Defines if the projections are drawn to the xz plane. Not Required. Default value: false

Example JS of the Visualization

Data

Datafile: csv

sepal_length,sepal_width,petal_length,petal_width,species
5.1,3.5,1.4,0.2,setosa
4.9,3.0,1.4,0.2,setosa
4.7,3.2,1.3,0.2,setosa
4.6,3.1,1.5,0.2,setosa
5.0,3.6,1.4,0.2,setosa
5.4,3.9,1.7,0.4,setosa
4.6,3.4,1.4,0.3,setosa