menu.js
import { dispatch } from 'd3';
export const menu = () => {
let id;
let labelText;
let options;
const listeners = dispatch('change');
const my = (selection) => {
selection
.selectAll('label')
.data([null])
.join('label')
.attr('for', id)
.text(labelText);
selection
.selectAll('select')
.data([null])
.join('select')
.attr('id', id)
.on('change', (event) => {
listeners.call('change', null, [
// Label Text
event.target.options[event.target.selectedIndex]
.text,
// Variable name
event.target.value,
]);
})
.selectAll('option')
.data(options)
.join('option')
.attr('value', (d) => d.value)
.text((d) => d.text);
};
A reusable scatter plot inspired by Towards Reusable Charts and Observable: selection.join.
Shows the Iris Dataset.
MIT Licensed