@domoinc/domo-select
v3.1.0
Published
DomoSelect - Domo Widget
Downloads
23
Readme
DomoSelect
Configuration Options
buttonIcon
Type: d3 selection
Default: null
d3 selection of the element for the button icon
centerText
Type: select
Default: {"name":"Left","value":false}
Set the text position
chartName
Type: string
Default: "Dropdown"
Name of chart for reporting
color
Type: string
Default: "lightGrey"
Color of the dropdown button
disabled
Type: boolean
Default: false
Disables the dropdown
domoScroll
Type: boolean
Default: true
Hides the scroll bar to the right of the dropdown
dropdownLocation
Type: string
Default: "bottom"
Direction that the dropdown extends from
height
Type: string
Default: "250px"
Height of the select
initialIndex
Type: number
Default: 0
Sets the default option to show on the select bar (the number corresponds to the options' order number in the dropdown)
isOnMobile
Type: boolean
Default: false
If true, it signals to the widget that it is running on a mobile device. Should be called before draw and then NEVER changed.
listIconFunction
Type: function
Default: "function () {}"
Function to run on each dropdown list item for icons.
listIconPadding
Type: number
Default: 0
Left padding on the dropdown
marginBottom
Type: string
Default: "0px"
Margin Bottom
orientation
Type: string
Default: "horizontal"
Orientation of the button
popoutHeight
Type: number
Default: "250px"
Height of the dropdown when opened
shouldValidate
Type: boolean
Default: true
Flag for turning off data validation
size
Type: string
Default: "small"
Size of the button and the dropdown
staticValue
Type: string
Default: null
Sets a static default value on the select
updateSizeableConfigs
Type: boolean
Default: true
Flag for turning off the mimic of illustrator's scale functionality
width
Type: number
Default: 250
Units: px
Width of the widget
Data Definition
Label
Type: string
Default validate:
function (d) { return this.accessor(d) !== 'undefined';}
Default accessor:
function (line) { return String(line[0]); }
Value
Type: string
Default validate:
function (d) { return this.accessor(d) !== 'undefined';}
Default accessor:
function (line) { return String(line[1]); }
Events
Dispatch Events
dispatch:click
dispatch:focusout
dispatch:blur
dispatch:selection
External Events
Example
var sampleData = [
['All', null],
['North', 'North'],
['East', 'East'],
['South', 'South'],
['West', 'West'],
];
var chart = d3.select("#vis")
.style({
width: '500px',
height: '500px'
})
.append('div')
.style({
position: 'absolute',
top: '225px',
left: '125px',
width: '250px'
})
.chart('DomoSelect')
.c({
width: 250,
});
chart.draw(sampleData);
setTimeout(function () {
chart.button.trigger('dispatch:click', sampleData[0]);
}, 1000);
setTimeout(function () {
chart.dropdown.trigger('click', sampleData[1]);
}, 2000);
setTimeout(function () {
chart.button.trigger('dispatch:click', sampleData[0]);
}, 3000);