@flourish/controls/controls.js

(function (global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
  typeof define === 'function' && define.amd ? define(factory) :
  (global = global || self, global.controls = factory());
}(this, (function () { 'use strict';

  var xhtml = "http://www.w3.org/1999/xhtml";

  var namespaces = {
    svg: "http://www.w3.org/2000/svg",
    xhtml: xhtml,
    xlink: "http://www.w3.org/1999/xlink",
    xml: "http://www.w3.org/XML/1998/namespace",
    xmlns: "http://www.w3.org/2000/xmlns/"
  };

  function namespace(name) {
    var prefix = name += "", i = prefix.indexOf(":");
    if (i >= 0 && (prefix = name.slice(0, i)) !== "xmlns") name = name.slice(i + 1);
    return namespaces.hasOwnProperty(prefix) ? {space: namespaces[prefix], local: name} : name;
  }

  function creatorInherit(name) {
    return function() {
      var document = this.ownerDocument,
          uri = this.namespaceURI;
      return uri === xhtml && document.documentElement.namespaceURI === xhtml
          ? document.createElement(name)
          : document.createElementNS(uri, name);
    };
  }

  function creatorFixed(fullname) {
    return function() {
      return this.ownerDocument.createElementNS(fullname.space, fullname.local);
    };
  }

  function creator(name) {
    var fullname = namespace(name);
    return (fullname.local
        ? creatorFixed
        : creatorInherit)(fullname);
  }

  function none() {}

  function selector(selector) {
    return selector == null ? none : function() {
      return this.querySelector(selector);
    };
  }

  function selection_select(select) {
    if (typeof select !== "function") select = selector(select);

    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = new Array(n), node, subnode, i = 0; i < n; ++i) {
        if ((node = group[i]) && (subnode = select.call(node, node.__data__, i, group))) {
          if ("__data__" in node) subnode.__data__ = node.__data__;
          subgroup[i] = subnode;
        }
      }
    }

    return new Selection(subgroups, this._parents);
  }

  function empty() {
    return [];
  }

  function selectorAll(selector) {
    return selector == null ? empty : function() {
      return this.querySelectorAll(selector);
    };
  }

  function selection_selectAll(select) {
    if (typeof select !== "function") select = selectorAll(select);

    for (var groups = this._groups, m = groups.length, subgroups = [], parents = [], j = 0; j < m; ++j) {
      for (var group = groups[j], n = group.length, node, i = 0; i < n; ++i) {
        if (node = group[i]) {
          subgroups.push(select.call(node, node.__data__, i, group));
          parents.push(node);
        }
      }
    }

    return new Selection(subgroups, parents);
  }

  function matcher(selector) {
    return function() {
      return this.matches(selector);
    };
  }

  function selection_filter(match) {
    if (typeof match !== "function") match = matcher(match);

    for (var groups = this._groups, m = groups.length, subgroups = new Array(m), j = 0; j < m; ++j) {
      for (var group = groups[j], n = group.length, subgroup = subgroups[j] = [], node, i = 0; i < n; ++i) {
        if ((node = group[i]) && match.call(node, node.__data__, i, group)) {
          subgroup.push(node);
        }
      }
    }

    return new Selection(subgroups, this._parents);
  }

  function sparse(update) {
    return new Array(update.length);
  }

  function selection_enter() {
    return new Selection(this._enter || this._groups.map(sparse), this._parents);
  }

  function EnterNode(parent, datum) {
    this.ownerDocument = parent.ownerDocument;
    this.namespaceURI = parent.namespaceURI;
    this._next = null;
    this._parent = parent;
    this.__data__ = datum;
  }

  EnterNode.prototype = {
    constructor: EnterNode,
    appendChild: function(child) { return this._parent.insertBefore(child, this._next); },
    insertBefore: function(child, next) { return this._parent.insertBefore(child, next); },
    querySelector: function(selector) { return this._parent.querySelector(selector); },
    querySelectorAll: function(selector) { return this._parent.querySelectorAll(selector); }
  };

  function constant(x) {
    return function() {
      return x;
    };
  }

  var keyPrefix = "$"; // Protect against keys like “__proto__”.

  function bindIndex(parent, group, enter, update, exit, data) {
    var i = 0,
        node,
        groupLength = group.length,
        dataLength = data.length;

    // Put any non-null nodes that fit into update.
    // Put any null nodes into enter.
    // Put any remaining data into enter.
    for (; i < dataLength; ++i) {
      if (node = group[i]) {
        node.__data__ = data[i];
        update[i] = node;
      } else {
        enter[i] = new EnterNode(parent, data[i]);
      }
    }

    // Put any non-null nodes that don’t fit into exit.
    for (; i < groupLength; ++i) {
      if (node = group[i]) {
        exit[i] = node;
      }
    }
  }

  function bindKey(parent, group, enter, update, exit, data, key) {
    var i,
        node,
        nodeByKeyValue = {},
        groupLength = group.length,
        dataLength = data.length,
        keyValues = new Array(groupLength),
        keyValue;

    // Compute the key for each node.
    // If multiple nodes have the same key, the duplicates are added to exit.
    for (i = 0; i < groupLength; ++i) {
      if (node = group[i]) {
        keyValues[i] = keyValue = keyPrefix + key.call(node, node.__data__, i, group);
        if (keyValue in nodeByKeyValue) {
          exit[i] = node;
        } else {
          nodeByKeyValue[keyValue] = node;
        }
      }
    }

    // Compute the key for each datum.
    // If there a node associated with this key, join and add it to update.
    // If there is not (or the key is a duplicate), add it to enter.
    for (i = 0; i < dataLength; ++i) {
      keyValue = keyPrefix + key.call(parent, data[i], i, data);
      if (node = nodeByKeyValue[keyValue]) {
        update[i] = node;
        node.__data__ = data[i];
        nodeByKeyValue[keyValue] = null;
      } else {
        enter[i] = new EnterNode(parent, data[i]);
      }
    }

    // Add any remaining nodes that were not bound to data to exit.
    for (i = 0; i < groupLength; ++i) {
      if ((node = group[i]) && (nodeByKeyValue[keyValues[i]] === node)) {
        exit[i] = node;
      }
    }
  }

  function selection_data(value, key) {
    if (!value) {
      data = new Array(this.size()), j = -1;
      this.each(function(d) { data[++j] = d; });
      return data;
    }

    var bind = key ? bindKey : bindIndex,
        parents = this._parents,
        groups = this._groups;

    if (typeof value !== "function") value = constant(value);

    for (var m = groups.length, update = new Array(m), enter = new Array(m), exit = new Array(m), j = 0; j < m; ++j) {
      var parent = parents[j],
          group = groups[j],
          groupLength = group.length,
          data = value.call(parent, parent && parent.__data__, j, parents),
          dataLength = data.length,
          enterGroup = enter[j] = new Array(dataLength),
          updateGroup = update[j] = new Array(dataLength),
          exitGroup = exit[j] = new Array(groupLength);

      bind(parent, group, enterGroup, updateGroup, exitGroup, data, key);

      // Now connect the enter nodes to their following update node, such that
      // appendChild can insert the materialized enter node before this node,
      // rather than at the end of the parent node.
      for (var i0 = 0, i1 = 0, previous, next; i0 < dataLength; ++i0) {
        if (previous = enterGroup[i0]) {
          if (i0 >= i1) i1 = i0 + 1;
          while (!(next = updateGroup[i1]) && ++i1 < dataLength);
          previous._next = next || null;
        }
      }
    }

    update = new Selection(update, parents);
    update._enter = enter;
    update._exit = exit;
    return update;
  }

  function selection_exit() {
    return new Selection(this._exit || this._groups.map(sparse), this._parents);
  }

  function selection_join(onenter, onupdate, onexit) {
    var enter = this.enter(), update = this, exit = this.exit();
    enter = typeof onenter === "function" ? onenter(enter) : enter.append(onenter + "");
    if (onupdate != null) update = onupdate(update);
    if (onexit == null) exit.remove(); else onexit(exit);
    return enter && update ? enter.merge(update).order() : update;
  }

  function selection_merge(selection) {

    for (var groups0 = this._groups, groups1 = selection._groups, m0 = groups0.length, m1 = groups1.length, m = Math.min(m0, m1), merges = new Array(m0), j = 0; j < m; ++j) {
      for (var group0 = groups0[j], group1 = groups1[j], n = group0.length, merge = merges[j] = new Array(n), node, i = 0; i < n; ++i) {
        if (node = group0[i] || group1[i]) {
          merge[i] = node;
        }
      }
    }

    for (; j < m0; ++j) {
      merges[j] = groups0[j];
    }

    return new Selection(merges, this._parents);
  }

  function selection_order() {

    for (var groups = this._groups, j = -1, m = groups.length; ++j < m;) {
      for (var group = groups[j], i = group.length - 1, next = group[i], node; --i >= 0;) {
        if (node = group[i]) {
          if (next && node.compareDocumentPosition(next) ^ 4) next.parentNode.insertBefore(node, next);
          next = node;
        }
      }
    }

    return this;
  }

  function selection_sort(compare) {
    if (!compare) compare = ascending;

    function compareNode(a, b) {
      return a && b ? compare(a.__data__, b.__data__) : !a - !b;
    }

    for (var groups = this._groups, m = groups.length, sortgroups = new Array(m), j = 0; j < m; ++j) {
      for (var group = groups[j], n = group.length, sortgroup = sortgroups[j] = new Array(n), node, i = 0; i < n; ++i) {
        if (node = group[i]) {
          sortgroup[i] = node;
        }
      }
      sortgroup.sort(compareNode);
    }

    return new Selection(sortgroups, this._parents).order();
  }

  function ascending(a, b) {
    return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
  }

  function selection_call() {
    var callback = arguments[0];
    arguments[0] = this;
    callback.apply(null, arguments);
    return this;
  }

  function selection_nodes() {
    var nodes = new Array(this.size()), i = -1;
    this.each(function() { nodes[++i] = this; });
    return nodes;
  }

  function selection_node() {

    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
      for (var group = groups[j], i = 0, n = group.length; i < n; ++i) {
        var node = group[i];
        if (node) return node;
      }
    }

    return null;
  }

  function selection_size() {
    var size = 0;
    this.each(function() { ++size; });
    return size;
  }

  function selection_empty() {
    return !this.node();
  }

  function selection_each(callback) {

    for (var groups = this._groups, j = 0, m = groups.length; j < m; ++j) {
      for (var group = groups[j], i = 0, n = group.length, node; i < n; ++i) {
        if (node = group[i]) callback.call(node, node.__data__, i, group);
      }
    }

    return this;
  }

  function attrRemove(name) {
    return function() {
      this.removeAttribute(name);
    };
  }

  function attrRemoveNS(fullname) {
    return function() {
      this.removeAttributeNS(fullname.space, fullname.local);
    };
  }

  function attrConstant(name, value) {
    return function() {
      this.setAttribute(name, value);
    };
  }

  function attrConstantNS(fullname, value) {
    return function() {
      this.setAttributeNS(fullname.space, fullname.local, value);
    };
  }

  function attrFunction(name, value) {
    return function() {
      var v = value.apply(this, arguments);
      if (v == null) this.removeAttribute(name);
      else this.setAttribute(name, v);
    };
  }

  function attrFunctionNS(fullname, value) {
    return function() {
      var v = value.apply(this, arguments);
      if (v == null) this.removeAttributeNS(fullname.space, fullname.local);
      else this.setAttributeNS(fullname.space, fullname.local, v);
    };
  }

  function selection_attr(name, value) {
    var fullname = namespace(name);

    if (arguments.length < 2) {
      var node = this.node();
      return fullname.local
          ? node.getAttributeNS(fullname.space, fullname.local)
          : node.getAttribute(fullname);
    }

    return this.each((value == null
        ? (fullname.local ? attrRemoveNS : attrRemove) : (typeof value === "function"
        ? (fullname.local ? attrFunctionNS : attrFunction)
        : (fullname.local ? attrConstantNS : attrConstant)))(fullname, value));
  }

  function defaultView(node) {
    return (node.ownerDocument && node.ownerDocument.defaultView) // node is a Node
        || (node.document && node) // node is a Window
        || node.defaultView; // node is a Document
  }

  function styleRemove(name) {
    return function() {
      this.style.removeProperty(name);
    };
  }

  function styleConstant(name, value, priority) {
    return function() {
      this.style.setProperty(name, value, priority);
    };
  }

  function styleFunction(name, value, priority) {
    return function() {
      var v = value.apply(this, arguments);
      if (v == null) this.style.removeProperty(name);
      else this.style.setProperty(name, v, priority);
    };
  }

  function selection_style(name, value, priority) {
    return arguments.length > 1
        ? this.each((value == null
              ? styleRemove : typeof value === "function"
              ? styleFunction
              : styleConstant)(name, value, priority == null ? "" : priority))
        : styleValue(this.node(), name);
  }

  function styleValue(node, name) {
    return node.style.getPropertyValue(name)
        || defaultView(node).getComputedStyle(node, null).getPropertyValue(name);
  }

  function propertyRemove(name) {
    return function() {
      delete this[name];
    };
  }

  function propertyConstant(name, value) {
    return function() {
      this[name] = value;
    };
  }

  function propertyFunction(name, value) {
    return function() {
      var v = value.apply(this, arguments);
      if (v == null) delete this[name];
      else this[name] = v;
    };
  }

  function selection_property(name, value) {
    return arguments.length > 1
        ? this.each((value == null
            ? propertyRemove : typeof value === "function"
            ? propertyFunction
            : propertyConstant)(name, value))
        : this.node()[name];
  }

  function classArray(string) {
    return string.trim().split(/^|\s+/);
  }

  function classList(node) {
    return node.classList || new ClassList(node);
  }

  function ClassList(node) {
    this._node = node;
    this._names = classArray(node.getAttribute("class") || "");
  }

  ClassList.prototype = {
    add: function(name) {
      var i = this._names.indexOf(name);
      if (i < 0) {
        this._names.push(name);
        this._node.setAttribute("class", this._names.join(" "));
      }
    },
    remove: function(name) {
      var i = this._names.indexOf(name);
      if (i >= 0) {
        this._names.splice(i, 1);
        this._node.setAttribute("class", this._names.join(" "));
      }
    },
    contains: function(name) {
      return this._names.indexOf(name) >= 0;
    }
  };

  function classedAdd(node, names) {
    var list = classList(node), i = -1, n = names.length;
    while (++i < n) list.add(names[i]);
  }

  function classedRemove(node, names) {
    var list = classList(node), i = -1, n = names.length;
    while (++i < n) list.remove(names[i]);
  }

  function classedTrue(names) {
    return function() {
      classedAdd(this, names);
    };
  }

  function classedFalse(names) {
    return function() {
      classedRemove(this, names);
    };
  }

  function classedFunction(names, value) {
    return function() {
      (value.apply(this, arguments) ? classedAdd : classedRemove)(this, names);
    };
  }

  function selection_classed(name, value) {
    var names = classArray(name + "");

    if (arguments.length < 2) {
      var list = classList(this.node()), i = -1, n = names.length;
      while (++i < n) if (!list.contains(names[i])) return false;
      return true;
    }

    return this.each((typeof value === "function"
        ? classedFunction : value
        ? classedTrue
        : classedFalse)(names, value));
  }

  function textRemove() {
    this.textContent = "";
  }

  function textConstant(value) {
    return function() {
      this.textContent = value;
    };
  }

  function textFunction(value) {
    return function() {
      var v = value.apply(this, arguments);
      this.textContent = v == null ? "" : v;
    };
  }

  function selection_text(value) {
    return arguments.length
        ? this.each(value == null
            ? textRemove : (typeof value === "function"
            ? textFunction
            : textConstant)(value))
        : this.node().textContent;
  }

  function htmlRemove() {
    this.innerHTML = "";
  }

  function htmlConstant(value) {
    return function() {
      this.innerHTML = value;
    };
  }

  function htmlFunction(value) {
    return function() {
      var v = value.apply(this, arguments);
      this.innerHTML = v == null ? "" : v;
    };
  }

  function selection_html(value) {
    return arguments.length
        ? this.each(value == null
            ? htmlRemove : (typeof value === "function"
            ? htmlFunction
            : htmlConstant)(value))
        : this.node().innerHTML;
  }

  function raise() {
    if (this.nextSibling) this.parentNode.appendChild(this);
  }

  function selection_raise() {
    return this.each(raise);
  }

  function lower() {
    if (this.previousSibling) this.parentNode.insertBefore(this, this.parentNode.firstChild);
  }

  function selection_lower() {
    return this.each(lower);
  }

  function selection_append(name) {
    var create = typeof name === "function" ? name : creator(name);
    return this.select(function() {
      return this.appendChild(create.apply(this, arguments));
    });
  }

  function constantNull() {
    return null;
  }

  function selection_insert(name, before) {
    var create = typeof name === "function" ? name : creator(name),
        select = before == null ? constantNull : typeof before === "function" ? before : selector(before);
    return this.select(function() {
      return this.insertBefore(create.apply(this, arguments), select.apply(this, arguments) || null);
    });
  }

  function remove() {
    var parent = this.parentNode;
    if (parent) parent.removeChild(this);
  }

  function selection_remove() {
    return this.each(remove);
  }

  function selection_cloneShallow() {
    return this.parentNode.insertBefore(this.cloneNode(false), this.nextSibling);
  }

  function selection_cloneDeep() {
    return this.parentNode.insertBefore(this.cloneNode(true), this.nextSibling);
  }

  function selection_clone(deep) {
    return this.select(deep ? selection_cloneDeep : selection_cloneShallow);
  }

  function selection_datum(value) {
    return arguments.length
        ? this.property("__data__", value)
        : this.node().__data__;
  }

  var filterEvents = {};

  var event$1 = null;

  if (typeof document !== "undefined") {
    var element = document.documentElement;
    if (!("onmouseenter" in element)) {
      filterEvents = {mouseenter: "mouseover", mouseleave: "mouseout"};
    }
  }

  function filterContextListener(listener, index, group) {
    listener = contextListener(listener, index, group);
    return function(event) {
      var related = event.relatedTarget;
      if (!related || (related !== this && !(related.compareDocumentPosition(this) & 8))) {
        listener.call(this, event);
      }
    };
  }

  function contextListener(listener, index, group) {
    return function(event1) {
      var event0 = event$1; // Events can be reentrant (e.g., focus).
      event$1 = event1;
      try {
        listener.call(this, this.__data__, index, group);
      } finally {
        event$1 = event0;
      }
    };
  }

  function parseTypenames(typenames) {
    return typenames.trim().split(/^|\s+/).map(function(t) {
      var name = "", i = t.indexOf(".");
      if (i >= 0) name = t.slice(i + 1), t = t.slice(0, i);
      return {type: t, name: name};
    });
  }

  function onRemove(typename) {
    return function() {
      var on = this.__on;
      if (!on) return;
      for (var j = 0, i = -1, m = on.length, o; j < m; ++j) {
        if (o = on[j], (!typename.type || o.type === typename.type) && o.name === typename.name) {
          this.removeEventListener(o.type, o.listener, o.capture);
        } else {
          on[++i] = o;
        }
      }
      if (++i) on.length = i;
      else delete this.__on;
    };
  }

  function onAdd(typename, value, capture) {
    var wrap = filterEvents.hasOwnProperty(typename.type) ? filterContextListener : contextListener;
    return function(d, i, group) {
      var on = this.__on, o, listener = wrap(value, i, group);
      if (on) for (var j = 0, m = on.length; j < m; ++j) {
        if ((o = on[j]).type === typename.type && o.name === typename.name) {
          this.removeEventListener(o.type, o.listener, o.capture);
          this.addEventListener(o.type, o.listener = listener, o.capture = capture);
          o.value = value;
          return;
        }
      }
      this.addEventListener(typename.type, listener, capture);
      o = {type: typename.type, name: typename.name, value: value, listener: listener, capture: capture};
      if (!on) this.__on = [o];
      else on.push(o);
    };
  }

  function selection_on(typename, value, capture) {
    var typenames = parseTypenames(typename + ""), i, n = typenames.length, t;

    if (arguments.length < 2) {
      var on = this.node().__on;
      if (on) for (var j = 0, m = on.length, o; j < m; ++j) {
        for (i = 0, o = on[j]; i < n; ++i) {
          if ((t = typenames[i]).type === o.type && t.name === o.name) {
            return o.value;
          }
        }
      }
      return;
    }

    on = value ? onAdd : onRemove;
    if (capture == null) capture = false;
    for (i = 0; i < n; ++i) this.each(on(typenames[i], value, capture));
    return this;
  }

  function dispatchEvent(node, type, params) {
    var window = defaultView(node),
        event = window.CustomEvent;

    if (typeof event === "function") {
      event = new event(type, params);
    } else {
      event = window.document.createEvent("Event");
      if (params) event.initEvent(type, params.bubbles, params.cancelable), event.detail = params.detail;
      else event.initEvent(type, false, false);
    }

    node.dispatchEvent(event);
  }

  function dispatchConstant(type, params) {
    return function() {
      return dispatchEvent(this, type, params);
    };
  }

  function dispatchFunction(type, params) {
    return function() {
      return dispatchEvent(this, type, params.apply(this, arguments));
    };
  }

  function selection_dispatch(type, params) {
    return this.each((typeof params === "function"
        ? dispatchFunction
        : dispatchConstant)(type, params));
  }

  var root = [null];

  function Selection(groups, parents) {
    this._groups = groups;
    this._parents = parents;
  }

  function selection() {
    return new Selection([[document.documentElement]], root);
  }

  Selection.prototype = selection.prototype = {
    constructor: Selection,
    select: selection_select,
    selectAll: selection_selectAll,
    filter: selection_filter,
    data: selection_data,
    enter: selection_enter,
    exit: selection_exit,
    join: selection_join,
    merge: selection_merge,
    order: selection_order,
    sort: selection_sort,
    call: selection_call,
    nodes: selection_nodes,
    node: selection_node,
    size: selection_size,
    empty: selection_empty,
    each: selection_each,
    attr: selection_attr,
    style: selection_style,
    property: selection_property,
    classed: selection_classed,
    text: selection_text,
    html: selection_html,
    raise: selection_raise,
    lower: selection_lower,
    append: selection_append,
    insert: selection_insert,
    remove: selection_remove,
    clone: selection_clone,
    datum: selection_datum,
    on: selection_on,
    dispatch: selection_dispatch
  };

  function select(selector) {
    return typeof selector === "string"
        ? new Selection([[document.querySelector(selector)]], [document.documentElement])
        : new Selection([[selector]], root);
  }

  function sourceEvent() {
    var current = event$1, source;
    while (source = current.sourceEvent) current = source;
    return current;
  }

  function point(node, event) {
    var svg = node.ownerSVGElement || node;

    if (svg.createSVGPoint) {
      var point = svg.createSVGPoint();
      point.x = event.clientX, point.y = event.clientY;
      point = point.matrixTransform(node.getScreenCTM().inverse());
      return [point.x, point.y];
    }

    var rect = node.getBoundingClientRect();
    return [event.clientX - rect.left - node.clientLeft, event.clientY - rect.top - node.clientTop];
  }

  function d3_mouse(node) {
    var event = sourceEvent();
    if (event.changedTouches) event = event.changedTouches[0];
    return point(node, event);
  }

  function ascending$1(a, b) {
  	return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
  }

  function sortArray(uarr, sort, parser, formatter) {
  	var sarr = uarr.map(function(d, i) {
  		var parsed_value = parser(d);
  		return	{
  			value: d,
  			options_index: i,
  			parsed: parsed_value,
  			display: formatter(d)
  		};
  	});

  	if (!sort) return sarr;
  	return sarr.sort(function(a, b) { return ascending$1(a.parsed, b.parsed); });
  }

  function Stylesheet() {
  	this.declarations = [];
  	return this;
  }

  Stylesheet.prototype.select = function(selector) {
  	if (!selector) return this;
  	var declaration = new Declaration(selector, this);
  	declaration.parent = this;
  	this.addDeclaration(declaration);

  	return declaration;
  };

  Stylesheet.prototype.addDeclaration = function(declaration) {
  	this.declarations.push(declaration);
  	return this;
  };

  Stylesheet.prototype.print = function() {
  	var text = "";
  	this.declarations.forEach(function(declaration) {
  		text += declaration.selector + " {\n";
  		declaration.styles.forEach(function(style) {
  			text += "\t" + style[0] + ": " + style[1] + ";\n";
  		});
  		text += "}\n\n";
  	});
  	return text;
  };

  Stylesheet.prototype.clear = function() {
  	this.declarations = [];
  	return this;
  };

  function Declaration(selector) {
  	this.selector = selector;
  	this.styles = [];
  	return this;
  }

  Declaration.prototype.style = function(property, _value) {
  	var value = typeof value_ == "function" ? _value() : _value;
  	if (value !== "" && value !== null && value !== undefined) this.styles.push([property, value]);
  	return this;
  };

  Declaration.prototype.select = function(selector) {
  	return this.parent.select(this.selector + " " + selector);
  };

  function createCssString() {
  	var s = new Stylesheet();

  	s.select(".fl-controls-container")
  		.style("display", "inline-block")
  		.style("line-height", "1em");

  	s.select(".fl-controls-title")
  		.style("display", "inline-block")
  		.style("margin", "0px 0.5em 0px 0px");

  	s.select(".fl-controls-container, .fl-controls-container *")
  		.style("box-sizing", "border-box");

  	s.select(".slider-holder")
  		.style("margin-bottom", "20px");

  	s.select(".fl-controls-slider, .slider-play")
  		.style("pointer-events", "all")
  		.style("display", "inline-block")
  		.style("vertical-align", "middle");

  	s.select(".slider-play svg")
  		.style("height", "100%")
  		.style("width", "100%")
  		.style("cursor", " pointer", "");

  	s.select(".slider-play:hover")
  		.style("opacity", "0.6");

  	s.select(".fl-control-slider")
  		.style("width", "100%")
  		.style("bottom", "0");

  	s.select(".fl-control")
  		.style("position", "relative");

  	s.select(".fl-control.hidden")
  		.style("display", "none");

  	s.select(".fl-control .button")
  		.style("display", "inline-block")
  		.style("background", "#eee")
  		.style("padding", "0.5em")
  		.style("margin-right", "0.25em")
  		.style("margin-bottom", "0.25em")
  		.style("line-height", "1em");

  	s.select(".fl-control.grouped:not(.hidden)")
  		.style("display", "inline-table")
  		.style("table-layout", "fixed")
  		.select(".button")
  		.style("display", "table-cell")
  		.style("margin", "0")
  		.style("text-align", "center");

  	s.select(".fl-control .button.selected")
  		.style("background", "#ddd");

  	s.select(".fl-control-dropdown")
  		.style("line-height", "1em")
  		.select(".list")
  		.style("display", "none")
  		.style("position", "absolute")
  		.style("background-color", "white")
  		.style("z-index", "100")
  		.style("border", "1px solid #eee")
  		.select(".list-item")
  		.style("text-align", "start")
  		.style("cursor", "pointer")
  		.style("padding", "0.5rem");

  	s.select(".fl-control-dropdown.open .list")
  		.style("display", "block");

  	s.select(".fl-control-dropdown .main")
  		.style("position", "relative")
  		.style("text-align", "start")
  		.style("display", "flex")
  		.style("justify-content", "space-between");

  	s.select(".fl-control-dropdown .symbol")
  		.style("float", "right")
  		.select("div")
  		.style("border-top-color", "#333333");

  	return s.print();
  }

  var css_injected = false;

  function injectCSS() {
  	if (css_injected || typeof document === "undefined") return;

  	var css_string = createCssString();

  	var head = document.head || document.getElementsByTagName("head")[0];
  	var style = document.createElement("style");
  	style.type = "text/css";
  	style.className = "flourish-controls";
  	head.appendChild(style);
  	if (style.styleSheet) {
  		style.styleSheet.cssText = css_string;
  	}
  	else {
  		style.appendChild(document.createTextNode(css_string));
  	}
  	css_injected = true;
  }

  var getTextWidth = (function() {
  	var context = document.createElement("canvas").getContext("2d");
  	return function(text, font) {
  		context.font = font || "10px sans-serif";
  		var metrics = context.measureText(text);
  		return metrics.width;
  	};
  })();

  var remToPx;

  function getRemToPx() {
  	var font_size = parseFloat(getComputedStyle(document.documentElement).fontSize) || 16;
  	remToPx = function (rem) { return rem * font_size; };
  }

  var MIN_HEIGHT = 90;
  function createDropdown(control_obj, state, container) {
  	var dropdown_obj = {};
  	var bounding_container = document.body;

  	// Add dropdown elements to container
  	var dropdown = select(container).append("div").attr("class", "fl-control fl-control-dropdown");
  	var dropdown_node = dropdown.node();
  	var dropdown_main = dropdown.append("div").attr("class", "main");
  	var dropdown_current = dropdown_main.append("span").attr("class", "current");
  	dropdown_main.append("span").attr("class", "symbol").style("width", "10px")
  		.append("div")
  		.style("border-left", "5px solid transparent")
  		.style("border-right", "5px solid transparent")
  		.style("border-bottom", "5px solid transparent")
  		.style("border-top-style", "solid")
  		.style("border-top-width", "5px")
  		.style("top", "50%")
  		.style("position", "absolute")
  		.style("margin-top", "-2.5px");
  	var dropdown_list = dropdown.append("div").attr("class", "list");

  	var showDropdownList = function() {
  		dropdown.classed("open", true);
  		dropdown_list.style("top", "100%");
  		dropdown_list.style("bottom", null);
  		dropdown_list.style("display", null);
  		dropdown_list.style("overflow", "auto");
  		var bounding_bb = bounding_container.getBoundingClientRect();
  		var list_bb = dropdown_list.node().getBoundingClientRect();
  		var overspill = list_bb.bottom - bounding_bb.bottom;
  		if (overspill > 0) {
  			var new_height = bounding_bb.bottom - list_bb.top - 30;
  			if (new_height > MIN_HEIGHT) dropdown_list.style("max-height", new_height + "px");
  			else dropdown_list
  				.style("top", "auto")
  				.style("bottom", "100%");
  		}
  		if (list_bb.right > window.innerWidth) {
  			dropdown_list.style("right", 0);
  		}
  	};

  	var hideDropdownList = function() {
  		dropdown.classed("open", false);
  		dropdown_list.style("right", null);
  		dropdown_list.style("max-height", null);
  		dropdown_list.style("display", "none");
  	};

  	var toggleDropdownList = function() {
  		if (dropdown.classed("open")) hideDropdownList();
  		else showDropdownList();
  	};

  	dropdown_main.on("click", function() { toggleDropdownList(); });

  	var clickHandler = function() {
  		if (!dropdown.classed("open")) return; // If already closed, nothing to close
  		var el = event.target;
  		var parent = el.parentElement;
  		while (parent) {
  			if (el === dropdown_node) return; // We've clicked the dropdown, don't close it here
  			el = parent;
  			parent = el.parentElement;
  		}
  		hideDropdownList(); // Clicked somewhere else, hide the dropdown
  	};

  	var showControl = function(longest_text_width) {
  		var dropdown_width = "100%";
  		if (state.dropdown_width_mode == "auto") {
  			dropdown_width = Math.min(longest_text_width + 40, remToPx(20)) + "px";
  		}
  		else if (state.dropdown_width_mode == "fixed") {
  			dropdown_width = remToPx(state.dropdown_width_fixed) + "px";
  		}
  		container.style.width = state.dropdown_width_mode == "full" ? dropdown_width : "";
  		dropdown.style("width", dropdown_width).style("display", state.dropdown_width_mode !== "full" ? "inline-table" : null);
  		dropdown.select(".main").style("width", dropdown_width);
  	};

  	var hideControl = function() {
  		hideDropdownList();
  		dropdown.style("display", "none");
  	};


  	dropdown_obj.appendedToDOM = function(_bounding_container) {
  		if (_bounding_container) bounding_container = _bounding_container;
  		document.querySelector("body").addEventListener("click", clickHandler, false);
  		return dropdown_obj;
  	};


  	dropdown_obj.removedFromDOM = function() {
  		document.querySelector("body").removeEventListener("click", clickHandler);
  		return dropdown_obj;
  	};

  	dropdown_obj.show = showControl;
  	dropdown_obj.hide = hideControl;


  	dropdown_obj.update = function(sorted_options) {
  		dropdown_list.text("");
  		var dropdown_font_size = window.getComputedStyle(dropdown.node()).fontSize;
  		if (!control_obj.n_options || state.control_type !== "dropdown") {
  			hideControl();
  			return dropdown_obj;
  		}

  		var longest_text = "";
  		dropdown_list.text("")
  			.selectAll(".list-item")
  			.data(sorted_options)
  			.enter()
  			.append("div")
  			.attr("class", "list-item")
  			.text(function(d) {
  				if (d.display.length > longest_text.length) longest_text = d.display;
  				return d.display;
  			})
  			.on("click", function(d) {
  				hideDropdownList();
  				var i = d.options_index;
  				if (i === control_obj.index()) return;
  				control_obj.index(i);
  				dropdown_current.text(d.display).attr("title", d.display);
  				control_obj.trigger("change");
  			});
  		var longest_text_width = getTextWidth(longest_text, dropdown_font_size + " sans-serif");
  		var sorted_index = control_obj.getSortedIndex();
  		var value = sorted_options[sorted_index].display;
  		dropdown_current.text(value).attr("title", value);

  		showControl(longest_text_width);

  		return dropdown_obj;
  	};


  	return dropdown_obj;
  }

  function createButtons(control_obj, state, container) {
  	var button_obj = {};
  	var button_container = select(container).append("div").attr("class", "fl-control fl-control-buttons");

  	var showControl = function() {
  		button_container.classed("hidden", false);
  	};

  	var hideControl = function() {
  		button_container.classed("hidden", true);
  	};

  	button_obj.show = showControl;
  	button_obj.hide = hideControl;

  	button_obj.update = function(sorted_options) {
  		if (!control_obj.n_options || state.control_type !== "buttons") {
  			hideControl();
  			return button_obj;
  		}

  		var index = control_obj.index();

  		button_container.classed("grouped", state.button_group);
  		button_container.classed("fixed-width", state.button_group_width_mode == "fixed" || state.button_group_width_mode == "full");
  		button_container.style("width", state.button_group && state.button_group_width_mode == "fixed" ? remToPx(state.button_group_width_fixed) + "px" : state.button_group_width_mode == "full" ? "100%" : null);

  		var clickHandler = function(d) {
  			var i = d.options_index;
  			if (i === control_obj.index()) return;
  			control_obj.index(i);
  			control_obj.trigger("change");
  		};

  		var buttons = button_container.selectAll(".button")
  			.data(sorted_options, function(d) { return d.display; });

  		var buttons_enter = buttons.enter()
  			.append("div")
  			.attr("class", "button")
  			.style("cursor", "pointer")
  			.attr("role", "button")
  			.attr("tabindex", 0)
  			.on("click", function(d) { clickHandler(d); })
  			.on("keyup", function(d) {
  				if (event$1.code === "Space" || event$1.code === "Enter") {
  					event$1.preventDefault();
  					clickHandler(d);
  				}
  			});

  		buttons_enter.append("span")
  			.text(function(d) { return d.display; });

  		showControl();

  		buttons.merge(buttons_enter)
  			.classed("selected", function(d) { return d.options_index === index; })
  			.attr("aria-pressed", function(d) { return d.options_index === index; });

  		buttons.exit().remove();

  		showControl();
  	};

  	return button_obj;
  }

  var slice = Array.prototype.slice;

  function identity(x) {
    return x;
  }

  var top = 1,
      right = 2,
      bottom = 3,
      left = 4,
      epsilon = 1e-6;

  function translateX(x) {
    return "translate(" + (x + 0.5) + ",0)";
  }

  function translateY(y) {
    return "translate(0," + (y + 0.5) + ")";
  }

  function number(scale) {
    return function(d) {
      return +scale(d);
    };
  }

  function center(scale) {
    var offset = Math.max(0, scale.bandwidth() - 1) / 2; // Adjust for 0.5px offset.
    if (scale.round()) offset = Math.round(offset);
    return function(d) {
      return +scale(d) + offset;
    };
  }

  function entering() {
    return !this.__axis;
  }

  function axis(orient, scale) {
    var tickArguments = [],
        tickValues = null,
        tickFormat = null,
        tickSizeInner = 6,
        tickSizeOuter = 6,
        tickPadding = 3,
        k = orient === top || orient === left ? -1 : 1,
        x = orient === left || orient === right ? "x" : "y",
        transform = orient === top || orient === bottom ? translateX : translateY;

    function axis(context) {
      var values = tickValues == null ? (scale.ticks ? scale.ticks.apply(scale, tickArguments) : scale.domain()) : tickValues,
          format = tickFormat == null ? (scale.tickFormat ? scale.tickFormat.apply(scale, tickArguments) : identity) : tickFormat,
          spacing = Math.max(tickSizeInner, 0) + tickPadding,
          range = scale.range(),
          range0 = +range[0] + 0.5,
          range1 = +range[range.length - 1] + 0.5,
          position = (scale.bandwidth ? center : number)(scale.copy()),
          selection = context.selection ? context.selection() : context,
          path = selection.selectAll(".domain").data([null]),
          tick = selection.selectAll(".tick").data(values, scale).order(),
          tickExit = tick.exit(),
          tickEnter = tick.enter().append("g").attr("class", "tick"),
          line = tick.select("line"),
          text = tick.select("text");

      path = path.merge(path.enter().insert("path", ".tick")
          .attr("class", "domain")
          .attr("stroke", "currentColor"));

      tick = tick.merge(tickEnter);

      line = line.merge(tickEnter.append("line")
          .attr("stroke", "currentColor")
          .attr(x + "2", k * tickSizeInner));

      text = text.merge(tickEnter.append("text")
          .attr("fill", "currentColor")
          .attr(x, k * spacing)
          .attr("dy", orient === top ? "0em" : orient === bottom ? "0.71em" : "0.32em"));

      if (context !== selection) {
        path = path.transition(context);
        tick = tick.transition(context);
        line = line.transition(context);
        text = text.transition(context);

        tickExit = tickExit.transition(context)
            .attr("opacity", epsilon)
            .attr("transform", function(d) { return isFinite(d = position(d)) ? transform(d) : this.getAttribute("transform"); });

        tickEnter
            .attr("opacity", epsilon)
            .attr("transform", function(d) { var p = this.parentNode.__axis; return transform(p && isFinite(p = p(d)) ? p : position(d)); });
      }

      tickExit.remove();

      path
          .attr("d", orient === left || orient == right
              ? (tickSizeOuter ? "M" + k * tickSizeOuter + "," + range0 + "H0.5V" + range1 + "H" + k * tickSizeOuter : "M0.5," + range0 + "V" + range1)
              : (tickSizeOuter ? "M" + range0 + "," + k * tickSizeOuter + "V0.5H" + range1 + "V" + k * tickSizeOuter : "M" + range0 + ",0.5H" + range1));

      tick
          .attr("opacity", 1)
          .attr("transform", function(d) { return transform(position(d)); });

      line
          .attr(x + "2", k * tickSizeInner);

      text
          .attr(x, k * spacing)
          .text(format);

      selection.filter(entering)
          .attr("fill", "none")
          .attr("font-size", 10)
          .attr("font-family", "sans-serif")
          .attr("text-anchor", orient === right ? "start" : orient === left ? "end" : "middle");

      selection
          .each(function() { this.__axis = position; });
    }

    axis.scale = function(_) {
      return arguments.length ? (scale = _, axis) : scale;
    };

    axis.ticks = function() {
      return tickArguments = slice.call(arguments), axis;
    };

    axis.tickArguments = function(_) {
      return arguments.length ? (tickArguments = _ == null ? [] : slice.call(_), axis) : tickArguments.slice();
    };

    axis.tickValues = function(_) {
      return arguments.length ? (tickValues = _ == null ? null : slice.call(_), axis) : tickValues && tickValues.slice();
    };

    axis.tickFormat = function(_) {
      return arguments.length ? (tickFormat = _, axis) : tickFormat;
    };

    axis.tickSize = function(_) {
      return arguments.length ? (tickSizeInner = tickSizeOuter = +_, axis) : tickSizeInner;
    };

    axis.tickSizeInner = function(_) {
      return arguments.length ? (tickSizeInner = +_, axis) : tickSizeInner;
    };

    axis.tickSizeOuter = function(_) {
      return arguments.length ? (tickSizeOuter = +_, axis) : tickSizeOuter;
    };

    axis.tickPadding = function(_) {
      return arguments.length ? (tickPadding = +_, axis) : tickPadding;
    };

    return axis;
  }

  function axisBottom(scale) {
    return axis(bottom, scale);
  }

  function ascending$2(a, b) {
    return a < b ? -1 : a > b ? 1 : a >= b ? 0 : NaN;
  }

  function bisector(compare) {
    if (compare.length === 1) compare = ascendingComparator(compare);
    return {
      left: function(a, x, lo, hi) {
        if (lo == null) lo = 0;
        if (hi == null) hi = a.length;
        while (lo < hi) {
          var mid = lo + hi >>> 1;
          if (compare(a[mid], x) < 0) lo = mid + 1;
          else hi = mid;
        }
        return lo;
      },
      right: function(a, x, lo, hi) {
        if (lo == null) lo = 0;
        if (hi == null) hi = a.length;
        while (lo < hi) {
          var mid = lo + hi >>> 1;
          if (compare(a[mid], x) > 0) hi = mid;
          else lo = mid + 1;
        }
        return lo;
      }
    };
  }

  function ascendingComparator(f) {
    return function(d, x) {
      return ascending$2(f(d), x);
    };
  }

  var ascendingBisect = bisector(ascending$2);
  var bisectRight = ascendingBisect.right;

  var e10 = Math.sqrt(50),
      e5 = Math.sqrt(10),
      e2 = Math.sqrt(2);

  function ticks(start, stop, count) {
    var reverse,
        i = -1,
        n,
        ticks,
        step;

    stop = +stop, start = +start, count = +count;
    if (start === stop && count > 0) return [start];
    if (reverse = stop < start) n = start, start = stop, stop = n;
    if ((step = tickIncrement(start, stop, count)) === 0 || !isFinite(step)) return [];

    if (step > 0) {
      start = Math.ceil(start / step);
      stop = Math.floor(stop / step);
      ticks = new Array(n = Math.ceil(stop - start + 1));
      while (++i < n) ticks[i] = (start + i) * step;
    } else {
      start = Math.floor(start * step);
      stop = Math.ceil(stop * step);
      ticks = new Array(n = Math.ceil(start - stop + 1));
      while (++i < n) ticks[i] = (start - i) / step;
    }

    if (reverse) ticks.reverse();

    return ticks;
  }

  function tickIncrement(start, stop, count) {
    var step = (stop - start) / Math.max(0, count),
        power = Math.floor(Math.log(step) / Math.LN10),
        error = step / Math.pow(10, power);
    return power >= 0
        ? (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1) * Math.pow(10, power)
        : -Math.pow(10, -power) / (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1);
  }

  function tickStep(start, stop, count) {
    var step0 = Math.abs(stop - start) / Math.max(0, count),
        step1 = Math.pow(10, Math.floor(Math.log(step0) / Math.LN10)),
        error = step0 / step1;
    if (error >= e10) step1 *= 10;
    else if (error >= e5) step1 *= 5;
    else if (error >= e2) step1 *= 2;
    return stop < start ? -step1 : step1;
  }

  function define(constructor, factory, prototype) {
    constructor.prototype = factory.prototype = prototype;
    prototype.constructor = constructor;
  }

  function extend(parent, definition) {
    var prototype = Object.create(parent.prototype);
    for (var key in definition) prototype[key] = definition[key];
    return prototype;
  }

  function Color() {}

  var darker = 0.7;
  var brighter = 1 / darker;

  var reI = "\\s*([+-]?\\d+)\\s*",
      reN = "\\s*([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)\\s*",
      reP = "\\s*([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)%\\s*",
      reHex3 = /^#([0-9a-f]{3})$/,
      reHex6 = /^#([0-9a-f]{6})$/,
      reRgbInteger = new RegExp("^rgb\\(" + [reI, reI, reI] + "\\)$"),
      reRgbPercent = new RegExp("^rgb\\(" + [reP, reP, reP] + "\\)$"),
      reRgbaInteger = new RegExp("^rgba\\(" + [reI, reI, reI, reN] + "\\)$"),
      reRgbaPercent = new RegExp("^rgba\\(" + [reP, reP, reP, reN] + "\\)$"),
      reHslPercent = new RegExp("^hsl\\(" + [reN, reP, reP] + "\\)$"),
      reHslaPercent = new RegExp("^hsla\\(" + [reN, reP, reP, reN] + "\\)$");

  var named = {
    aliceblue: 0xf0f8ff,
    antiquewhite: 0xfaebd7,
    aqua: 0x00ffff,
    aquamarine: 0x7fffd4,
    azure: 0xf0ffff,
    beige: 0xf5f5dc,
    bisque: 0xffe4c4,
    black: 0x000000,
    blanchedalmond: 0xffebcd,
    blue: 0x0000ff,
    blueviolet: 0x8a2be2,
    brown: 0xa52a2a,
    burlywood: 0xdeb887,
    cadetblue: 0x5f9ea0,
    chartreuse: 0x7fff00,
    chocolate: 0xd2691e,
    coral: 0xff7f50,
    cornflowerblue: 0x6495ed,
    cornsilk: 0xfff8dc,
    crimson: 0xdc143c,
    cyan: 0x00ffff,
    darkblue: 0x00008b,
    darkcyan: 0x008b8b,
    darkgoldenrod: 0xb8860b,
    darkgray: 0xa9a9a9,
    darkgreen: 0x006400,
    darkgrey: 0xa9a9a9,
    darkkhaki: 0xbdb76b,
    darkmagenta: 0x8b008b,
    darkolivegreen: 0x556b2f,
    darkorange: 0xff8c00,
    darkorchid: 0x9932cc,
    darkred: 0x8b0000,
    darksalmon: 0xe9967a,
    darkseagreen: 0x8fbc8f,
    darkslateblue: 0x483d8b,
    darkslategray: 0x2f4f4f,
    darkslategrey: 0x2f4f4f,
    darkturquoise: 0x00ced1,
    darkviolet: 0x9400d3,
    deeppink: 0xff1493,
    deepskyblue: 0x00bfff,
    dimgray: 0x696969,
    dimgrey: 0x696969,
    dodgerblue: 0x1e90ff,
    firebrick: 0xb22222,
    floralwhite: 0xfffaf0,
    forestgreen: 0x228b22,
    fuchsia: 0xff00ff,
    gainsboro: 0xdcdcdc,
    ghostwhite: 0xf8f8ff,
    gold: 0xffd700,
    goldenrod: 0xdaa520,
    gray: 0x808080,
    green: 0x008000,
    greenyellow: 0xadff2f,
    grey: 0x808080,
    honeydew: 0xf0fff0,
    hotpink: 0xff69b4,
    indianred: 0xcd5c5c,
    indigo: 0x4b0082,
    ivory: 0xfffff0,
    khaki: 0xf0e68c,
    lavender: 0xe6e6fa,
    lavenderblush: 0xfff0f5,
    lawngreen: 0x7cfc00,
    lemonchiffon: 0xfffacd,
    lightblue: 0xadd8e6,
    lightcoral: 0xf08080,
    lightcyan: 0xe0ffff,
    lightgoldenrodyellow: 0xfafad2,
    lightgray: 0xd3d3d3,
    lightgreen: 0x90ee90,
    lightgrey: 0xd3d3d3,
    lightpink: 0xffb6c1,
    lightsalmon: 0xffa07a,
    lightseagreen: 0x20b2aa,
    lightskyblue: 0x87cefa,
    lightslategray: 0x778899,
    lightslategrey: 0x778899,
    lightsteelblue: 0xb0c4de,
    lightyellow: 0xffffe0,
    lime: 0x00ff00,
    limegreen: 0x32cd32,
    linen: 0xfaf0e6,
    magenta: 0xff00ff,
    maroon: 0x800000,
    mediumaquamarine: 0x66cdaa,
    mediumblue: 0x0000cd,
    mediumorchid: 0xba55d3,
    mediumpurple: 0x9370db,
    mediumseagreen: 0x3cb371,
    mediumslateblue: 0x7b68ee,
    mediumspringgreen: 0x00fa9a,
    mediumturquoise: 0x48d1cc,
    mediumvioletred: 0xc71585,
    midnightblue: 0x191970,
    mintcream: 0xf5fffa,
    mistyrose: 0xffe4e1,
    moccasin: 0xffe4b5,
    navajowhite: 0xffdead,
    navy: 0x000080,
    oldlace: 0xfdf5e6,
    olive: 0x808000,
    olivedrab: 0x6b8e23,
    orange: 0xffa500,
    orangered: 0xff4500,
    orchid: 0xda70d6,
    palegoldenrod: 0xeee8aa,
    palegreen: 0x98fb98,
    paleturquoise: 0xafeeee,
    palevioletred: 0xdb7093,
    papayawhip: 0xffefd5,
    peachpuff: 0xffdab9,
    peru: 0xcd853f,
    pink: 0xffc0cb,
    plum: 0xdda0dd,
    powderblue: 0xb0e0e6,
    purple: 0x800080,
    rebeccapurple: 0x663399,
    red: 0xff0000,
    rosybrown: 0xbc8f8f,
    royalblue: 0x4169e1,
    saddlebrown: 0x8b4513,
    salmon: 0xfa8072,
    sandybrown: 0xf4a460,
    seagreen: 0x2e8b57,
    seashell: 0xfff5ee,
    sienna: 0xa0522d,
    silver: 0xc0c0c0,
    skyblue: 0x87ceeb,
    slateblue: 0x6a5acd,
    slategray: 0x708090,
    slategrey: 0x708090,
    snow: 0xfffafa,
    springgreen: 0x00ff7f,
    steelblue: 0x4682b4,
    tan: 0xd2b48c,
    teal: 0x008080,
    thistle: 0xd8bfd8,
    tomato: 0xff6347,
    turquoise: 0x40e0d0,
    violet: 0xee82ee,
    wheat: 0xf5deb3,
    white: 0xffffff,
    whitesmoke: 0xf5f5f5,
    yellow: 0xffff00,
    yellowgreen: 0x9acd32
  };

  define(Color, color, {
    displayable: function() {
      return this.rgb().displayable();
    },
    hex: function() {
      return this.rgb().hex();
    },
    toString: function() {
      return this.rgb() + "";
    }
  });

  function color(format) {
    var m;
    format = (format + "").trim().toLowerCase();
    return (m = reHex3.exec(format)) ? (m = parseInt(m[1], 16), new Rgb((m >> 8 & 0xf) | (m >> 4 & 0x0f0), (m >> 4 & 0xf) | (m & 0xf0), ((m & 0xf) << 4) | (m & 0xf), 1)) // #f00
        : (m = reHex6.exec(format)) ? rgbn(parseInt(m[1], 16)) // #ff0000
        : (m = reRgbInteger.exec(format)) ? new Rgb(m[1], m[2], m[3], 1) // rgb(255, 0, 0)
        : (m = reRgbPercent.exec(format)) ? new Rgb(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100, 1) // rgb(100%, 0%, 0%)
        : (m = reRgbaInteger.exec(format)) ? rgba(m[1], m[2], m[3], m[4]) // rgba(255, 0, 0, 1)
        : (m = reRgbaPercent.exec(format)) ? rgba(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100, m[4]) // rgb(100%, 0%, 0%, 1)
        : (m = reHslPercent.exec(format)) ? hsla(m[1], m[2] / 100, m[3] / 100, 1) // hsl(120, 50%, 50%)
        : (m = reHslaPercent.exec(format)) ? hsla(m[1], m[2] / 100, m[3] / 100, m[4]) // hsla(120, 50%, 50%, 1)
        : named.hasOwnProperty(format) ? rgbn(named[format])
        : format === "transparent" ? new Rgb(NaN, NaN, NaN, 0)
        : null;
  }

  function rgbn(n) {
    return new Rgb(n >> 16 & 0xff, n >> 8 & 0xff, n & 0xff, 1);
  }

  function rgba(r, g, b, a) {
    if (a <= 0) r = g = b = NaN;
    return new Rgb(r, g, b, a);
  }

  function rgbConvert(o) {
    if (!(o instanceof Color)) o = color(o);
    if (!o) return new Rgb;
    o = o.rgb();
    return new Rgb(o.r, o.g, o.b, o.opacity);
  }

  function rgb(r, g, b, opacity) {
    return arguments.length === 1 ? rgbConvert(r) : new Rgb(r, g, b, opacity == null ? 1 : opacity);
  }

  function Rgb(r, g, b, opacity) {
    this.r = +r;
    this.g = +g;
    this.b = +b;
    this.opacity = +opacity;
  }

  define(Rgb, rgb, extend(Color, {
    brighter: function(k) {
      k = k == null ? brighter : Math.pow(brighter, k);
      return new Rgb(this.r * k, this.g * k, this.b * k, this.opacity);
    },
    darker: function(k) {
      k = k == null ? darker : Math.pow(darker, k);
      return new Rgb(this.r * k, this.g * k, this.b * k, this.opacity);
    },
    rgb: function() {
      return this;
    },
    displayable: function() {
      return (0 <= this.r && this.r <= 255)
          && (0 <= this.g && this.g <= 255)
          && (0 <= this.b && this.b <= 255)
          && (0 <= this.opacity && this.opacity <= 1);
    },
    hex: function() {
      return "#" + hex(this.r) + hex(this.g) + hex(this.b);
    },
    toString: function() {
      var a = this.opacity; a = isNaN(a) ? 1 : Math.max(0, Math.min(1, a));
      return (a === 1 ? "rgb(" : "rgba(")
          + Math.max(0, Math.min(255, Math.round(this.r) || 0)) + ", "
          + Math.max(0, Math.min(255, Math.round(this.g) || 0)) + ", "
          + Math.max(0, Math.min(255, Math.round(this.b) || 0))
          + (a === 1 ? ")" : ", " + a + ")");
    }
  }));

  function hex(value) {
    value = Math.max(0, Math.min(255, Math.round(value) || 0));
    return (value < 16 ? "0" : "") + value.toString(16);
  }

  function hsla(h, s, l, a) {
    if (a <= 0) h = s = l = NaN;
    else if (l <= 0 || l >= 1) h = s = NaN;
    else if (s <= 0) h = NaN;
    return new Hsl(h, s, l, a);
  }

  function hslConvert(o) {
    if (o instanceof Hsl) return new Hsl(o.h, o.s, o.l, o.opacity);
    if (!(o instanceof Color)) o = color(o);
    if (!o) return new Hsl;
    if (o instanceof Hsl) return o;
    o = o.rgb();
    var r = o.r / 255,
        g = o.g / 255,
        b = o.b / 255,
        min = Math.min(r, g, b),
        max = Math.max(r, g, b),
        h = NaN,
        s = max - min,
        l = (max + min) / 2;
    if (s) {
      if (r === max) h = (g - b) / s + (g < b) * 6;
      else if (g === max) h = (b - r) / s + 2;
      else h = (r - g) / s + 4;
      s /= l < 0.5 ? max + min : 2 - max - min;
      h *= 60;
    } else {
      s = l > 0 && l < 1 ? 0 : h;
    }
    return new Hsl(h, s, l, o.opacity);
  }

  function hsl(h, s, l, opacity) {
    return arguments.length === 1 ? hslConvert(h) : new Hsl(h, s, l, opacity == null ? 1 : opacity);
  }

  function Hsl(h, s, l, opacity) {
    this.h = +h;
    this.s = +s;
    this.l = +l;
    this.opacity = +opacity;
  }

  define(Hsl, hsl, extend(Color, {
    brighter: function(k) {
      k = k == null ? brighter : Math.pow(brighter, k);
      return new Hsl(this.h, this.s, this.l * k, this.opacity);
    },
    darker: function(k) {
      k = k == null ? darker : Math.pow(darker, k);
      return new Hsl(this.h, this.s, this.l * k, this.opacity);
    },
    rgb: function() {
      var h = this.h % 360 + (this.h < 0) * 360,
          s = isNaN(h) || isNaN(this.s) ? 0 : this.s,
          l = this.l,
          m2 = l + (l < 0.5 ? l : 1 - l) * s,
          m1 = 2 * l - m2;
      return new Rgb(
        hsl2rgb(h >= 240 ? h - 240 : h + 120, m1, m2),
        hsl2rgb(h, m1, m2),
        hsl2rgb(h < 120 ? h + 240 : h - 120, m1, m2),
        this.opacity
      );
    },
    displayable: function() {
      return (0 <= this.s && this.s <= 1 || isNaN(this.s))
          && (0 <= this.l && this.l <= 1)
          && (0 <= this.opacity && this.opacity <= 1);
    }
  }));

  /* From FvD 13.37, CSS Color Module Level 3 */
  function hsl2rgb(h, m1, m2) {
    return (h < 60 ? m1 + (m2 - m1) * h / 60
        : h < 180 ? m2
        : h < 240 ? m1 + (m2 - m1) * (240 - h) / 60
        : m1) * 255;
  }

  var deg2rad = Math.PI / 180;
  var rad2deg = 180 / Math.PI;

  // https://beta.observablehq.com/@mbostock/lab-and-rgb
  var K = 18,
      Xn = 0.96422,
      Yn = 1,
      Zn = 0.82521,
      t0 = 4 / 29,
      t1 = 6 / 29,
      t2 = 3 * t1 * t1,
      t3 = t1 * t1 * t1;

  function labConvert(o) {
    if (o instanceof Lab) return new Lab(o.l, o.a, o.b, o.opacity);
    if (o instanceof Hcl) {
      if (isNaN(o.h)) return new Lab(o.l, 0, 0, o.opacity);
      var h = o.h * deg2rad;
      return new Lab(o.l, Math.cos(h) * o.c, Math.sin(h) * o.c, o.opacity);
    }
    if (!(o instanceof Rgb)) o = rgbConvert(o);
    var r = rgb2lrgb(o.r),
        g = rgb2lrgb(o.g),
        b = rgb2lrgb(o.b),
        y = xyz2lab((0.2225045 * r + 0.7168786 * g + 0.0606169 * b) / Yn), x, z;
    if (r === g && g === b) x = z = y; else {
      x = xyz2lab((0.4360747 * r + 0.3850649 * g + 0.1430804 * b) / Xn);
      z = xyz2lab((0.0139322 * r + 0.0971045 * g + 0.7141733 * b) / Zn);
    }
    return new Lab(116 * y - 16, 500 * (x - y), 200 * (y - z), o.opacity);
  }

  function lab(l, a, b, opacity) {
    return arguments.length === 1 ? labConvert(l) : new Lab(l, a, b, opacity == null ? 1 : opacity);
  }

  function Lab(l, a, b, opacity) {
    this.l = +l;
    this.a = +a;
    this.b = +b;
    this.opacity = +opacity;
  }

  define(Lab, lab, extend(Color, {
    brighter: function(k) {
      return new Lab(this.l + K * (k == null ? 1 : k), this.a, this.b, this.opacity);
    },
    darker: function(k) {
      return new Lab(this.l - K * (k == null ? 1 : k), this.a, this.b, this.opacity);
    },
    rgb: function() {
      var y = (this.l + 16) / 116,
          x = isNaN(this.a) ? y : y + this.a / 500,
          z = isNaN(this.b) ? y : y - this.b / 200;
      x = Xn * lab2xyz(x);
      y = Yn * lab2xyz(y);
      z = Zn * lab2xyz(z);
      return new Rgb(
        lrgb2rgb( 3.1338561 * x - 1.6168667 * y - 0.4906146 * z),
        lrgb2rgb(-0.9787684 * x + 1.9161415 * y + 0.0334540 * z),
        lrgb2rgb( 0.0719453 * x - 0.2289914 * y + 1.4052427 * z),
        this.opacity
      );
    }
  }));

  function xyz2lab(t) {
    return t > t3 ? Math.pow(t, 1 / 3) : t / t2 + t0;
  }

  function lab2xyz(t) {
    return t > t1 ? t * t * t : t2 * (t - t0);
  }

  function lrgb2rgb(x) {
    return 255 * (x <= 0.0031308 ? 12.92 * x : 1.055 * Math.pow(x, 1 / 2.4) - 0.055);
  }

  function rgb2lrgb(x) {
    return (x /= 255) <= 0.04045 ? x / 12.92 : Math.pow((x + 0.055) / 1.055, 2.4);
  }

  function hclConvert(o) {
    if (o instanceof Hcl) return new Hcl(o.h, o.c, o.l, o.opacity);
    if (!(o instanceof Lab)) o = labConvert(o);
    if (o.a === 0 && o.b === 0) return new Hcl(NaN, 0, o.l, o.opacity);
    var h = Math.atan2(o.b, o.a) * rad2deg;
    return new Hcl(h < 0 ? h + 360 : h, Math.sqrt(o.a * o.a + o.b * o.b), o.l, o.opacity);
  }

  function hcl(h, c, l, opacity) {
    return arguments.length === 1 ? hclConvert(h) : new Hcl(h, c, l, opacity == null ? 1 : opacity);
  }

  function Hcl(h, c, l, opacity) {
    this.h = +h;
    this.c = +c;
    this.l = +l;
    this.opacity = +opacity;
  }

  define(Hcl, hcl, extend(Color, {
    brighter: function(k) {
      return new Hcl(this.h, this.c, this.l + K * (k == null ? 1 : k), this.opacity);
    },
    darker: function(k) {
      return new Hcl(this.h, this.c, this.l - K * (k == null ? 1 : k), this.opacity);
    },
    rgb: function() {
      return labConvert(this).rgb();
    }
  }));

  var A = -0.14861,
      B = +1.78277,
      C = -0.29227,
      D = -0.90649,
      E = +1.97294,
      ED = E * D,
      EB = E * B,
      BC_DA = B * C - D * A;

  function cubehelixConvert(o) {
    if (o instanceof Cubehelix) return new Cubehelix(o.h, o.s, o.l, o.opacity);
    if (!(o instanceof Rgb)) o = rgbConvert(o);
    var r = o.r / 255,
        g = o.g / 255,
        b = o.b / 255,
        l = (BC_DA * b + ED * r - EB * g) / (BC_DA + ED - EB),
        bl = b - l,
        k = (E * (g - l) - C * bl) / D,
        s = Math.sqrt(k * k + bl * bl) / (E * l * (1 - l)), // NaN if l=0 or l=1
        h = s ? Math.atan2(k, bl) * rad2deg - 120 : NaN;
    return new Cubehelix(h < 0 ? h + 360 : h, s, l, o.opacity);
  }

  function cubehelix(h, s, l, opacity) {
    return arguments.length === 1 ? cubehelixConvert(h) : new Cubehelix(h, s, l, opacity == null ? 1 : opacity);
  }

  function Cubehelix(h, s, l, opacity) {
    this.h = +h;
    this.s = +s;
    this.l = +l;
    this.opacity = +opacity;
  }

  define(Cubehelix, cubehelix, extend(Color, {
    brighter: function(k) {
      k = k == null ? brighter : Math.pow(brighter, k);
      return new Cubehelix(this.h, this.s, this.l * k, this.opacity);
    },
    darker: function(k) {
      k = k == null ? darker : Math.pow(darker, k);
      return new Cubehelix(this.h, this.s, this.l * k, this.opacity);
    },
    rgb: function() {
      var h = isNaN(this.h) ? 0 : (this.h + 120) * deg2rad,
          l = +this.l,
          a = isNaN(this.s) ? 0 : this.s * l * (1 - l),
          cosh = Math.cos(h),
          sinh = Math.sin(h);
      return new Rgb(
        255 * (l + a * (A * cosh + B * sinh)),
        255 * (l + a * (C * cosh + D * sinh)),
        255 * (l + a * (E * cosh)),
        this.opacity
      );
    }
  }));

  function constant$1(x) {
    return function() {
      return x;
    };
  }

  function linear(a, d) {
    return function(t) {
      return a + t * d;
    };
  }

  function exponential(a, b, y) {
    return a = Math.pow(a, y), b = Math.pow(b, y) - a, y = 1 / y, function(t) {
      return Math.pow(a + t * b, y);
    };
  }

  function gamma(y) {
    return (y = +y) === 1 ? nogamma : function(a, b) {
      return b - a ? exponential(a, b, y) : constant$1(isNaN(a) ? b : a);
    };
  }

  function nogamma(a, b) {
    var d = b - a;
    return d ? linear(a, d) : constant$1(isNaN(a) ? b : a);
  }

  var rgb$1 = (function rgbGamma(y) {
    var color = gamma(y);

    function rgb$1(start, end) {
      var r = color((start = rgb(start)).r, (end = rgb(end)).r),
          g = color(start.g, end.g),
          b = color(start.b, end.b),
          opacity = nogamma(start.opacity, end.opacity);
      return function(t) {
        start.r = r(t);
        start.g = g(t);
        start.b = b(t);
        start.opacity = opacity(t);
        return start + "";
      };
    }

    rgb$1.gamma = rgbGamma;

    return rgb$1;
  })(1);

  function array(a, b) {
    var nb = b ? b.length : 0,
        na = a ? Math.min(nb, a.length) : 0,
        x = new Array(na),
        c = new Array(nb),
        i;

    for (i = 0; i < na; ++i) x[i] = interpolateValue(a[i], b[i]);
    for (; i < nb; ++i) c[i] = b[i];

    return function(t) {
      for (i = 0; i < na; ++i) c[i] = x[i](t);
      return c;
    };
  }

  function date(a, b) {
    var d = new Date;
    return a = +a, b -= a, function(t) {
      return d.setTime(a + b * t), d;
    };
  }

  function reinterpolate(a, b) {
    return a = +a, b -= a, function(t) {
      return a + b * t;
    };
  }

  function object(a, b) {
    var i = {},
        c = {},
        k;

    if (a === null || typeof a !== "object") a = {};
    if (b === null || typeof b !== "object") b = {};

    for (k in b) {
      if (k in a) {
        i[k] = interpolateValue(a[k], b[k]);
      } else {
        c[k] = b[k];
      }
    }

    return function(t) {
      for (k in i) c[k] = i[k](t);
      return c;
    };
  }

  var reA = /[-+]?(?:\d+\.?\d*|\.?\d+)(?:[eE][-+]?\d+)?/g,
      reB = new RegExp(reA.source, "g");

  function zero(b) {
    return function() {
      return b;
    };
  }

  function one(b) {
    return function(t) {
      return b(t) + "";
    };
  }

  function string(a, b) {
    var bi = reA.lastIndex = reB.lastIndex = 0, // scan index for next number in b
        am, // current match in a
        bm, // current match in b
        bs, // string preceding current number in b, if any
        i = -1, // index in s
        s = [], // string constants and placeholders
        q = []; // number interpolators

    // Coerce inputs to strings.
    a = a + "", b = b + "";

    // Interpolate pairs of numbers in a & b.
    while ((am = reA.exec(a))
        && (bm = reB.exec(b))) {
      if ((bs = bm.index) > bi) { // a string precedes the next number in b
        bs = b.slice(bi, bs);
        if (s[i]) s[i] += bs; // coalesce with previous string
        else s[++i] = bs;
      }
      if ((am = am[0]) === (bm = bm[0])) { // numbers in a & b match
        if (s[i]) s[i] += bm; // coalesce with previous string
        else s[++i] = bm;
      } else { // interpolate non-matching numbers
        s[++i] = null;
        q.push({i: i, x: reinterpolate(am, bm)});
      }
      bi = reB.lastIndex;
    }

    // Add remains of b.
    if (bi < b.length) {
      bs = b.slice(bi);
      if (s[i]) s[i] += bs; // coalesce with previous string
      else s[++i] = bs;
    }

    // Special optimization for only a single match.
    // Otherwise, interpolate each of the numbers and rejoin the string.
    return s.length < 2 ? (q[0]
        ? one(q[0].x)
        : zero(b))
        : (b = q.length, function(t) {
            for (var i = 0, o; i < b; ++i) s[(o = q[i]).i] = o.x(t);
            return s.join("");
          });
  }

  function interpolateValue(a, b) {
    var t = typeof b, c;
    return b == null || t === "boolean" ? constant$1(b)
        : (t === "number" ? reinterpolate
        : t === "string" ? ((c = color(b)) ? (b = c, rgb$1) : string)
        : b instanceof color ? rgb$1
        : b instanceof Date ? date
        : Array.isArray(b) ? array
        : typeof b.valueOf !== "function" && typeof b.toString !== "function" || isNaN(b) ? object
        : reinterpolate)(a, b);
  }

  function interpolateRound(a, b) {
    return a = +a, b -= a, function(t) {
      return Math.round(a + b * t);
    };
  }

  var array$1 = Array.prototype;

  var map = array$1.map;
  var slice$1 = array$1.slice;

  function constant$2(x) {
    return function() {
      return x;
    };
  }

  function number$1(x) {
    return +x;
  }

  var unit = [0, 1];

  function deinterpolateLinear(a, b) {
    return (b -= (a = +a))
        ? function(x) { return (x - a) / b; }
        : constant$2(b);
  }

  function deinterpolateClamp(deinterpolate) {
    return function(a, b) {
      var d = deinterpolate(a = +a, b = +b);
      return function(x) { return x <= a ? 0 : x >= b ? 1 : d(x); };
    };
  }

  function reinterpolateClamp(reinterpolate) {
    return function(a, b) {
      var r = reinterpolate(a = +a, b = +b);
      return function(t) { return t <= 0 ? a : t >= 1 ? b : r(t); };
    };
  }

  function bimap(domain, range, deinterpolate, reinterpolate) {
    var d0 = domain[0], d1 = domain[1], r0 = range[0], r1 = range[1];
    if (d1 < d0) d0 = deinterpolate(d1, d0), r0 = reinterpolate(r1, r0);
    else d0 = deinterpolate(d0, d1), r0 = reinterpolate(r0, r1);
    return function(x) { return r0(d0(x)); };
  }

  function polymap(domain, range, deinterpolate, reinterpolate) {
    var j = Math.min(domain.length, range.length) - 1,
        d = new Array(j),
        r = new Array(j),
        i = -1;

    // Reverse descending domains.
    if (domain[j] < domain[0]) {
      domain = domain.slice().reverse();
      range = range.slice().reverse();
    }

    while (++i < j) {
      d[i] = deinterpolate(domain[i], domain[i + 1]);
      r[i] = reinterpolate(range[i], range[i + 1]);
    }

    return function(x) {
      var i = bisectRight(domain, x, 1, j) - 1;
      return r[i](d[i](x));
    };
  }

  function copy(source, target) {
    return target
        .domain(source.domain())
        .range(source.range())
        .interpolate(source.interpolate())
        .clamp(source.clamp());
  }

  // deinterpolate(a, b)(x) takes a domain value x in [a,b] and returns the corresponding parameter t in [0,1].
  // reinterpolate(a, b)(t) takes a parameter t in [0,1] and returns the corresponding domain value x in [a,b].
  function continuous(deinterpolate, reinterpolate) {
    var domain = unit,
        range = unit,
        interpolate = interpolateValue,
        clamp = false,
        piecewise,
        output,
        input;

    function rescale() {
      piecewise = Math.min(domain.length, range.length) > 2 ? polymap : bimap;
      output = input = null;
      return scale;
    }

    function scale(x) {
      return (output || (output = piecewise(domain, range, clamp ? deinterpolateClamp(deinterpolate) : deinterpolate, interpolate)))(+x);
    }

    scale.invert = function(y) {
      return (input || (input = piecewise(range, domain, deinterpolateLinear, clamp ? reinterpolateClamp(reinterpolate) : reinterpolate)))(+y);
    };

    scale.domain = function(_) {
      return arguments.length ? (domain = map.call(_, number$1), rescale()) : domain.slice();
    };

    scale.range = function(_) {
      return arguments.length ? (range = slice$1.call(_), rescale()) : range.slice();
    };

    scale.rangeRound = function(_) {
      return range = slice$1.call(_), interpolate = interpolateRound, rescale();
    };

    scale.clamp = function(_) {
      return arguments.length ? (clamp = !!_, rescale()) : clamp;
    };

    scale.interpolate = function(_) {
      return arguments.length ? (interpolate = _, rescale()) : interpolate;
    };

    return rescale();
  }

  // Computes the decimal coefficient and exponent of the specified number x with
  // significant digits p, where x is positive and p is in [1, 21] or undefined.
  // For example, formatDecimal(1.23) returns ["123", 0].
  function formatDecimal(x, p) {
    if ((i = (x = p ? x.toExponential(p - 1) : x.toExponential()).indexOf("e")) < 0) return null; // NaN, ±Infinity
    var i, coefficient = x.slice(0, i);

    // The string returned by toExponential either has the form \d\.\d+e[-+]\d+
    // (e.g., 1.2e+3) or the form \de[-+]\d+ (e.g., 1e+3).
    return [
      coefficient.length > 1 ? coefficient[0] + coefficient.slice(2) : coefficient,
      +x.slice(i + 1)
    ];
  }

  function exponent(x) {
    return x = formatDecimal(Math.abs(x)), x ? x[1] : NaN;
  }

  function formatGroup(grouping, thousands) {
    return function(value, width) {
      var i = value.length,
          t = [],
          j = 0,
          g = grouping[0],
          length = 0;

      while (i > 0 && g > 0) {
        if (length + g + 1 > width) g = Math.max(1, width - length);
        t.push(value.substring(i -= g, i + g));
        if ((length += g + 1) > width) break;
        g = grouping[j = (j + 1) % grouping.length];
      }

      return t.reverse().join(thousands);
    };
  }

  function formatNumerals(numerals) {
    return function(value) {
      return value.replace(/[0-9]/g, function(i) {
        return numerals[+i];
      });
    };
  }

  // [[fill]align][sign][symbol][0][width][,][.precision][~][type]
  var re = /^(?:(.)?([<>=^]))?([+\-( ])?([$#])?(0)?(\d+)?(,)?(\.\d+)?(~)?([a-z%])?$/i;

  function formatSpecifier(specifier) {
    return new FormatSpecifier(specifier);
  }

  formatSpecifier.prototype = FormatSpecifier.prototype; // instanceof

  function FormatSpecifier(specifier) {
    if (!(match = re.exec(specifier))) throw new Error("invalid format: " + specifier);
    var match;
    this.fill = match[1] || " ";
    this.align = match[2] || ">";
    this.sign = match[3] || "-";
    this.symbol = match[4] || "";
    this.zero = !!match[5];
    this.width = match[6] && +match[6];
    this.comma = !!match[7];
    this.precision = match[8] && +match[8].slice(1);
    this.trim = !!match[9];
    this.type = match[10] || "";
  }

  FormatSpecifier.prototype.toString = function() {
    return this.fill
        + this.align
        + this.sign
        + this.symbol
        + (this.zero ? "0" : "")
        + (this.width == null ? "" : Math.max(1, this.width | 0))
        + (this.comma ? "," : "")
        + (this.precision == null ? "" : "." + Math.max(0, this.precision | 0))
        + (this.trim ? "~" : "")
        + this.type;
  };

  // Trims insignificant zeros, e.g., replaces 1.2000k with 1.2k.
  function formatTrim(s) {
    out: for (var n = s.length, i = 1, i0 = -1, i1; i < n; ++i) {
      switch (s[i]) {
        case ".": i0 = i1 = i; break;
        case "0": if (i0 === 0) i0 = i; i1 = i; break;
        default: if (i0 > 0) { if (!+s[i]) break out; i0 = 0; } break;
      }
    }
    return i0 > 0 ? s.slice(0, i0) + s.slice(i1 + 1) : s;
  }

  var prefixExponent;

  function formatPrefixAuto(x, p) {
    var d = formatDecimal(x, p);
    if (!d) return x + "";
    var coefficient = d[0],
        exponent = d[1],
        i = exponent - (prefixExponent = Math.max(-8, Math.min(8, Math.floor(exponent / 3))) * 3) + 1,
        n = coefficient.length;
    return i === n ? coefficient
        : i > n ? coefficient + new Array(i - n + 1).join("0")
        : i > 0 ? coefficient.slice(0, i) + "." + coefficient.slice(i)
        : "0." + new Array(1 - i).join("0") + formatDecimal(x, Math.max(0, p + i - 1))[0]; // less than 1y!
  }

  function formatRounded(x, p) {
    var d = formatDecimal(x, p);
    if (!d) return x + "";
    var coefficient = d[0],
        exponent = d[1];
    return exponent < 0 ? "0." + new Array(-exponent).join("0") + coefficient
        : coefficient.length > exponent + 1 ? coefficient.slice(0, exponent + 1) + "." + coefficient.slice(exponent + 1)
        : coefficient + new Array(exponent - coefficient.length + 2).join("0");
  }

  var formatTypes = {
    "%": function(x, p) { return (x * 100).toFixed(p); },
    "b": function(x) { return Math.round(x).toString(2); },
    "c": function(x) { return x + ""; },
    "d": function(x) { return Math.round(x).toString(10); },
    "e": function(x, p) { return x.toExponential(p); },
    "f": function(x, p) { return x.toFixed(p); },
    "g": function(x, p) { return x.toPrecision(p); },
    "o": function(x) { return Math.round(x).toString(8); },
    "p": function(x, p) { return formatRounded(x * 100, p); },
    "r": formatRounded,
    "s": formatPrefixAuto,
    "X": function(x) { return Math.round(x).toString(16).toUpperCase(); },
    "x": function(x) { return Math.round(x).toString(16); }
  };

  function identity$1(x) {
    return x;
  }

  var prefixes = ["y","z","a","f","p","n","µ","m","","k","M","G","T","P","E","Z","Y"];

  function formatLocale(locale) {
    var group = locale.grouping && locale.thousands ? formatGroup(locale.grouping, locale.thousands) : identity$1,
        currency = locale.currency,
        decimal = locale.decimal,
        numerals = locale.numerals ? formatNumerals(locale.numerals) : identity$1,
        percent = locale.percent || "%";

    function newFormat(specifier) {
      specifier = formatSpecifier(specifier);

      var fill = specifier.fill,
          align = specifier.align,
          sign = specifier.sign,
          symbol = specifier.symbol,
          zero = specifier.zero,
          width = specifier.width,
          comma = specifier.comma,
          precision = specifier.precision,
          trim = specifier.trim,
          type = specifier.type;

      // The "n" type is an alias for ",g".
      if (type === "n") comma = true, type = "g";

      // The "" type, and any invalid type, is an alias for ".12~g".
      else if (!formatTypes[type]) precision == null && (precision = 12), trim = true, type = "g";

      // If zero fill is specified, padding goes after sign and before digits.
      if (zero || (fill === "0" && align === "=")) zero = true, fill = "0", align = "=";

      // Compute the prefix and suffix.
      // For SI-prefix, the suffix is lazily computed.
      var prefix = symbol === "$" ? currency[0] : symbol === "#" && /[boxX]/.test(type) ? "0" + type.toLowerCase() : "",
          suffix = symbol === "$" ? currency[1] : /[%p]/.test(type) ? percent : "";

      // What format function should we use?
      // Is this an integer type?
      // Can this type generate exponential notation?
      var formatType = formatTypes[type],
          maybeSuffix = /[defgprs%]/.test(type);

      // Set the default precision if not specified,
      // or clamp the specified precision to the supported range.
      // For significant precision, it must be in [1, 21].
      // For fixed precision, it must be in [0, 20].
      precision = precision == null ? 6
          : /[gprs]/.test(type) ? Math.max(1, Math.min(21, precision))
          : Math.max(0, Math.min(20, precision));

      function format(value) {
        var valuePrefix = prefix,
            valueSuffix = suffix,
            i, n, c;

        if (type === "c") {
          valueSuffix = formatType(value) + valueSuffix;
          value = "";
        } else {
          value = +value;

          // Perform the initial formatting.
          var valueNegative = value < 0;
          value = formatType(Math.abs(value), precision);

          // Trim insignificant zeros.
          if (trim) value = formatTrim(value);

          // If a negative value rounds to zero during formatting, treat as positive.
          if (valueNegative && +value === 0) valueNegative = false;

          // Compute the prefix and suffix.
          valuePrefix = (valueNegative ? (sign === "(" ? sign : "-") : sign === "-" || sign === "(" ? "" : sign) + valuePrefix;
          valueSuffix = (type === "s" ? prefixes[8 + prefixExponent / 3] : "") + valueSuffix + (valueNegative && sign === "(" ? ")" : "");

          // Break the formatted value into the integer “value” part that can be
          // grouped, and fractional or exponential “suffix” part that is not.
          if (maybeSuffix) {
            i = -1, n = value.length;
            while (++i < n) {
              if (c = value.charCodeAt(i), 48 > c || c > 57) {
                valueSuffix = (c === 46 ? decimal + value.slice(i + 1) : value.slice(i)) + valueSuffix;
                value = value.slice(0, i);
                break;
              }
            }
          }
        }

        // If the fill character is not "0", grouping is applied before padding.
        if (comma && !zero) value = group(value, Infinity);

        // Compute the padding.
        var length = valuePrefix.length + value.length + valueSuffix.length,
            padding = length < width ? new Array(width - length + 1).join(fill) : "";

        // If the fill character is "0", grouping is applied after padding.
        if (comma && zero) value = group(padding + value, padding.length ? width - valueSuffix.length : Infinity), padding = "";

        // Reconstruct the final output based on the desired alignment.
        switch (align) {
          case "<": value = valuePrefix + value + valueSuffix + padding; break;
          case "=": value = valuePrefix + padding + value + valueSuffix; break;
          case "^": value = padding.slice(0, length = padding.length >> 1) + valuePrefix + value + valueSuffix + padding.slice(length); break;
          default: value = padding + valuePrefix + value + valueSuffix; break;
        }

        return numerals(value);
      }

      format.toString = function() {
        return specifier + "";
      };

      return format;
    }

    function formatPrefix(specifier, value) {
      var f = newFormat((specifier = formatSpecifier(specifier), specifier.type = "f", specifier)),
          e = Math.max(-8, Math.min(8, Math.floor(exponent(value) / 3))) * 3,
          k = Math.pow(10, -e),
          prefix = prefixes[8 + e / 3];
      return function(value) {
        return f(k * value) + prefix;
      };
    }

    return {
      format: newFormat,
      formatPrefix: formatPrefix
    };
  }

  var locale;
  var format;
  var formatPrefix;

  defaultLocale({
    decimal: ".",
    thousands: ",",
    grouping: [3],
    currency: ["$", ""]
  });

  function defaultLocale(definition) {
    locale = formatLocale(definition);
    format = locale.format;
    formatPrefix = locale.formatPrefix;
    return locale;
  }

  function precisionFixed(step) {
    return Math.max(0, -exponent(Math.abs(step)));
  }

  function precisionPrefix(step, value) {
    return Math.max(0, Math.max(-8, Math.min(8, Math.floor(exponent(value) / 3))) * 3 - exponent(Math.abs(step)));
  }

  function precisionRound(step, max) {
    step = Math.abs(step), max = Math.abs(max) - step;
    return Math.max(0, exponent(max) - exponent(step)) + 1;
  }

  function tickFormat(domain, count, specifier) {
    var start = domain[0],
        stop = domain[domain.length - 1],
        step = tickStep(start, stop, count == null ? 10 : count),
        precision;
    specifier = formatSpecifier(specifier == null ? ",f" : specifier);
    switch (specifier.type) {
      case "s": {
        var value = Math.max(Math.abs(start), Math.abs(stop));
        if (specifier.precision == null && !isNaN(precision = precisionPrefix(step, value))) specifier.precision = precision;
        return formatPrefix(specifier, value);
      }
      case "":
      case "e":
      case "g":
      case "p":
      case "r": {
        if (specifier.precision == null && !isNaN(precision = precisionRound(step, Math.max(Math.abs(start), Math.abs(stop))))) specifier.precision = precision - (specifier.type === "e");
        break;
      }
      case "f":
      case "%": {
        if (specifier.precision == null && !isNaN(precision = precisionFixed(step))) specifier.precision = precision - (specifier.type === "%") * 2;
        break;
      }
    }
    return format(specifier);
  }

  function linearish(scale) {
    var domain = scale.domain;

    scale.ticks = function(count) {
      var d = domain();
      return ticks(d[0], d[d.length - 1], count == null ? 10 : count);
    };

    scale.tickFormat = function(count, specifier) {
      return tickFormat(domain(), count, specifier);
    };

    scale.nice = function(count) {
      if (count == null) count = 10;

      var d = domain(),
          i0 = 0,
          i1 = d.length - 1,
          start = d[i0],
          stop = d[i1],
          step;

      if (stop < start) {
        step = start, start = stop, stop = step;
        step = i0, i0 = i1, i1 = step;
      }

      step = tickIncrement(start, stop, count);

      if (step > 0) {
        start = Math.floor(start / step) * step;
        stop = Math.ceil(stop / step) * step;
        step = tickIncrement(start, stop, count);
      } else if (step < 0) {
        start = Math.ceil(start * step) / step;
        stop = Math.floor(stop * step) / step;
        step = tickIncrement(start, stop, count);
      }

      if (step > 0) {
        d[i0] = Math.floor(start / step) * step;
        d[i1] = Math.ceil(stop / step) * step;
        domain(d);
      } else if (step < 0) {
        d[i0] = Math.ceil(start * step) / step;
        d[i1] = Math.floor(stop * step) / step;
        domain(d);
      }

      return scale;
    };

    return scale;
  }

  function linear$1() {
    var scale = continuous(deinterpolateLinear, reinterpolate);

    scale.copy = function() {
      return copy(scale, linear$1());
    };

    return linearish(scale);
  }

  var VERSION = "1.3.2";

  function Slider(selector) {
  	this.container = select(selector);

  	this._width = null;
  	this._height = null;

  	this._handleRadius = 15;
  	this._channelHeight = 5;
  	this._channelRadius = null;

  	this._handleFill = "black";
  	this._channelFill = "#eee";

  	this._margin = { top: null, left: null, right: null };

  	this._domain = [0, 1];
  	this._value = null;
  	this._snap = false;

  	this._scale = null;
  	this._axis = false;
  	this._ticks = null;
  	this._tickFormat = null;
  	this._tickSize = null;

  	this._label = null;
  	this._labelSize = 18;

  	this._startLabel = null;
  	this._startLabelBelow = false;

  	this._endLabel = null;
  	this._endLabelBelow = false;

  	this._startEndLabelSize = 16;

  	this.handlers = { "change": [] };
  }

  // Create accessor methods for all the _parameters defined by the constructor
  function accessor(k) {
  	if (k.length > 0 && k.charAt(0) == "_") {
  		Slider.prototype[k.substr(1)] = function(v) {
  			if (typeof v == "undefined") return this[k];
  			this[k] = v;
  			return this;
  		};
  	}
  }
  var s = new Slider();
  for (var k in s) {
  	accessor(k);
  }

  // Special accessor function for margin
  Slider.prototype.margin = function Slider_margin(options) {
  	if (!options) return this._margin;
  	for (k in options) {
  		if (k in this._margin) this._margin[k] = options[k];
  		else throw "Slider.margin: unrecognised option " + k;
  	}
  	return this;
  };

  // Attach event handlers
  Slider.prototype.on = function Slider_on(event, handler) {
  	if (!(event in this.handlers)) throw "Slider.on: No such event: " + event;
  	this.handlers[event].push(handler);
  	return this;
  };

  // Fire event
  Slider.prototype.fire = function Slider_fire(event, d) {
  	if (!(event in this.handlers)) throw "Slider.fire: No such event: " + event;
  	var handlers = this.handlers[event];
  	for (var i = 0; i < handlers.length; i++) {
  		handlers[i].call(this, d);
  	}
  	return this;
  };

  // Binary search
  function closestValue(sorted_list, value, a, b) {
  	if (typeof a === "undefined") a = 0;
  	if (typeof b === "undefined") b = sorted_list.length;

  	if (b-a == 0) return value;
  	if (b-a == 1) return sorted_list[a];
  	if (b-a == 2) {
  		var d1 = Math.abs(sorted_list[a] - value),
  		    d2 = Math.abs(sorted_list[a+1] - value);
  		if (d1 <= d2) return sorted_list[a];
  		else return sorted_list[a+1];
  	}

  	var mid = a + Math.floor((b-a) / 2),
  	    mid_v = sorted_list[mid],
  	    pre = mid - 1,
  	    pre_v = sorted_list[pre];
  	if (pre_v <= value && value <= mid_v) {
  		return (Math.abs(pre_v - value) <= Math.abs(mid_v - value)) ? pre_v : mid_v;
  	}
  	if (mid_v <= value) return closestValue(sorted_list, value, mid, b);
  	else return closestValue(sorted_list, value, a, mid);
  }

  function snapTo(specification, value) {
  	if (typeof specification == "boolean") {
  		return specification ? Math.round(value) : value;
  	}
  	// Otherwise assume “specification” is a sorted array
  	return closestValue(specification, value);
  }

  // Draw or update the slider
  Slider.prototype.draw = function Slider_draw() {
  	var that = this;

  	var cw = this._width,
  	    ch = this._height;

  	var container_node = this.container.node();

  	// If the width and height have not been specified, use
  	// the client size of the container element.
  	if (!cw) {
  		var r = container_node.getBoundingClientRect();
  		// If there isn’t a bounding client rect, e.g. because
  		// the container is display: none;, then do nothing.
  		if (!r || r.width == 0) return this;

  		cw = r.width;
  		ch = r.height;
  	}

  	var channel_r = this._channelRadius == null ? this._channelHeight/2 : this._channelRadius,
  	    left_margin = (this._margin.left == null ? Math.max(this._handleRadius, channel_r) : this._margin.left),
  	    right_margin = (this._margin.right == null ? Math.max(this._handleRadius, channel_r) : this._margin.right),
  	    top_margin = this._margin.top == null ? Math.max(this._handleRadius, this._channelHeight/2) : this._margin.top,
  	    w = cw - left_margin - right_margin, // Inner width of the slider channel (excluding endcaps)
  	    channel_w = w + 2*channel_r, // Width of the slider channel (including endcaps)
  	    label_h = this._labelSize * 1.5;

  	if (this._label != null && this._margin.top == null) top_margin += label_h;

  	var slider;
  	if (container_node.namespaceURI == "http://www.w3.org/2000/svg") {
  		slider = this.container;
  	}
  	else {
  		slider = this.container.selectAll("svg").data([{ width: cw, height: ch }]);
  		slider.exit().remove();
  		slider = slider.enter().append("svg").merge(slider);
  		slider.attr("width", function(d) { return d.width; })
  			.attr("height", function(d) { return d.height; });
  	}

  	var g = slider.selectAll("g.slider-container").data([{left: left_margin, top: top_margin, id: this._id}]);
  	g.exit().remove();
  	g = g.enter().append("g").attr("class", "slider-container").merge(g);
  	g.attr("transform", function(d) {
  		return "translate(" + d.left + "," + d.top + ")";
  	})
  	.attr("id", function(d) { return d.id; });

  	this.scale = (this._scale ? this._scale() : linear$1()).domain(this._domain).range([0, w]);

  	if (this._value == null || this._value < this._domain[0]) this._value = this._domain[0];
  	else if (this._value > this._domain[1]) this._value = this._domain[1];

  	if (this._snap) this._value = snapTo(this._snap, this._value);

  	var axes_data = [];
  	if (this._axis) {
  		var axis;
  		if (typeof this._axis != "boolean") {
  			axis = this._axis(this.scale);
  		}
  		else {
  			axis = axisBottom().scale(this.scale).tickPadding(6);
  		}

  		if (this._ticks) axis.ticks(this._ticks);
  		if (this._tickFormat) axis.tickFormat(this._tickFormat);
  		if (this._tickSize) axis.tickSize(this._tickSize);
  		else axis.tickSize(Math.max(5, this._handleRadius - this._channelHeight - 2));
  		axes_data.push(axis);
  	}

  	var axes = g.selectAll(".slider-axis");
  	var axes_enter = axes.data(axes_data).enter();
  	axes_enter.append("g").attr("class", "slider-axis")
  		.attr("transform", "translate(" + 0 + "," + this._channelHeight/2 + ")")
  		.each(function(axis) { axis(select(this)); });
  	axes_enter.select(".domain").attr("fill", "none");
  	axes_enter.selectAll(".tick line").attr("stroke", "black");
  	axes_enter.exit().remove();

  	var channel, handle;
  	channel = g.selectAll(".slider-channel")
  		.data([{ width: channel_w, height: this._channelHeight, channel_r: channel_r }]);
  	channel.exit().remove();

  	channel = channel.enter().append("rect").attr("class", "slider-channel")
  		.attr("cursor", "pointer")
  		.on("click", function() {
  			var slider_x = Math.max(0, Math.min(w, d3_mouse(this)[0]));
  			that._value = that.scale.invert(slider_x);
  			if (that._snap) that._value = snapTo(that._snap, that._value);
  			handle.attr("cx", that.scale(that._value));
  			that.fire("change", that._value);
  		})
  		.merge(channel);

  	channel.attr("width", function(d) { return d.width; })
  		.attr("fill", this._channelFill)
  		.attr("height", function(d) { return d.height; })
  		.attr("y", function(d) { return -d.height/2; })
  		.attr("x", function(d) { return -d.channel_r; })
  		.attr("rx", function(d) { return d.channel_r; });

  	var drag_dx_origin, drag_x_origin;
  	function handleMousedown(event) {
  		document.addEventListener("mouseup", handleMouseup, false);
  		document.addEventListener("mousemove", handleMousemove, false);
  		drag_dx_origin = event.clientX;
  		drag_x_origin = that.scale(that._value);
  	}

  	function handleMouseup() {
  		document.removeEventListener("mouseup", handleMouseup, false);
  		document.removeEventListener("mousemove", handleMousemove, false);
  	}

  	function handleMousemove(event) {
  		drag(event.clientX - drag_dx_origin);
  	}

  	function handleTouchstart(event) {
  		if (event.touches.length != 1) return;
  		document.addEventListener("touchend", handleTouchend, false);
  		document.addEventListener("touchmove", handleTouchmove, false);
  		drag_dx_origin = event.touches[0].clientX;
  		drag_x_origin = that.scale(that._value);
  	}

  	function handleTouchend() {
  		document.removeEventListener("touchend", handleTouchend, false);
  		document.removeEventListener("touchmove", handleTouchmove, false);
  	}

  	function handleTouchmove(event) {
  		if (event.touches.length != 1) return;
  		drag(event.touches[0].clientX - drag_dx_origin);
  	}

  	function drag(dx) {
  		var new_x = drag_x_origin + dx;
  		var slider_x = Math.max(0, Math.min(w, new_x));
  		var new_value = that.scale.invert(slider_x);
  		if (that._snap) new_value = snapTo(that._snap, new_value);
  		handle.attr("cx", that.scale(new_value));
  		if (new_value != that._value) {
  			that._value = new_value;
  			that.fire("change", that._value);
  		}
  	}

  	handle = g.selectAll(".slider-handle").data([{ v: this._value, x: this.scale(this._value) }]);
  	handle = handle.enter().append("circle").attr("class", "slider-handle")
  		.attr("cursor", "col-resize")
  		.merge(handle);

  	handle.attr("cx", function(d) { return d.x; })
  		.attr("r", this._handleRadius)
  		.attr("fill", this._handleFill)
  		.on("mousedown", function() {
  			event$1.preventDefault();
  			handleMousedown(event$1);
  		})
  		.on("touchstart", function() {
  			event$1.preventDefault();
  			handleTouchstart(event$1);
  		});

  	var label_data = [];
  	if (this._label) {
  		label_data.push({
  			label: this._label, x: w/2, y: -label_h, font_size: this._labelSize
  		});
  	}
  	var label = g.selectAll(".slider-label").data(label_data);
  	label.exit().remove();
  	label = label.enter()
  		.append("text").attr("class", "slider-label")
  		.attr("text-anchor", "middle")
  		.attr("cursor", "default")
  		.merge(label);

  	label
  		.text(function(d) { return d.label; })
  		.attr("x", function(d) { return d.x; })
  		.attr("y", function(d) { return d.y; })
  		.attr("font-size", this._labelSize);

  	var end_label_data = [];
  	if (this._startLabel) {
  		end_label_data.push({
  			label: this._startLabel,
  			x: this._startLabelBelow ? 0 : -(channel_r + 5 + Math.max(0, this._handleRadius - channel_r)),
  			y: this._startLabelBelow ? (channel_r + 15) : this._startEndLabelSize/1.75 - channel_r/2,
  			anchor: this._startLabelBelow ? "middle" : "end",
  			font_size: this._startEndLabelSize
  		});
  	}
  	if (this._endLabel) {
  		end_label_data.push({
  			label: this._endLabel,
  			x: this._endLabelBelow ? w : w + (channel_r + Math.max(0, this._handleRadius - channel_r) + 5),
  			y: this._startLabelBelow ? (channel_r + 15) : this._startEndLabelSize/1.75 - channel_r/2,
  			anchor: this._endLabelBelow ? "middle" : "start",
  			font_size: this._startEndLabelSize
  		});
  	}

  	var end_labels = g.selectAll(".slider-end-labels").data(end_label_data);
  	end_labels.exit().remove();
  	end_labels = end_labels.enter().append("text").attr("class", "slider-end-labels")
  		.attr("pointer-events", "none")
  		.merge(end_labels);
  	end_labels
  		.text(function(d) { return d.label; })
  		.attr("font-size", function(d) { return d.font_size; })
  		.attr("x", function(d) { return d.x; })
  		.attr("y", function(d) { return d.y; })
  		.attr("text-anchor", function(d) { return d.anchor; });

  	return this;
  };

  Slider.prototype.update = Slider.prototype.draw;

  function Flourish_slider(selector) {
  	return new Slider(selector);
  }
  Flourish_slider.version = VERSION;

  function createPlayButton(colour) {
  	var start_string = '<svg width="25px" height="30px" viewBox="0 0 25 30"> <polygon fill="';
  	var end_string = '" stroke="none" points="25 15 0 30 0 0"></polygon> </svg>';
  	return start_string + colour + end_string;
  }

  function createPauseButton(colour) {
  	var start_string = '<svg width="26px" height="30px" viewBox="0 0 26 30"> <g stroke="none" stroke-width="1" fill="';
  	var end_string = '"><rect x="2" y="2" width="9" height="26"></rect> <rect x="15" y="2" width="9" height="26"></rect> </g> </svg>';
  	return start_string + colour + end_string;
  }

  function createSlider(control_obj, state, container) {
  	var slider_obj = {};
  	var slider_holder = select(container).append("div").attr("class", "fl-control fl-control-slider animatable");
  	var slider_play_button = slider_holder.append("div").attr("class", "slider-play");
  	var slider_div = slider_holder.append("div").attr("class", "fl-controls-slider");

  	var play_string, pause_string, handle_color;
  	var sorted_options, timesteps, is_playing;
  	var timer_id = null;

  	var clearTimer = function() {
  		clearTimeout(timer_id);
  		timer_id = null;
  	};

  	var sliderChangeFunction = function(i) {
  		var d = sorted_options[i];
  		if (d.options_index === control_obj.index()) return;
  		control_obj.index(d.options_index);
  		control_obj.trigger("change");
  	};

  	var slider = Flourish_slider(slider_div.node())
  		.snap(true)
  		.on("change", function(i) {
  			var is_playing = timer_id !== null;
  			if (is_playing) clearTimer();
  			sliderChangeFunction(i);
  			if (is_playing) setNextTick();
  		});


  	var stopSliderPlayer = function() {
  		clearTimer();
  		slider_holder.classed("playing", false);
  		slider_play_button.html(play_string);
  		control_obj._isPlaying_(false);
  		is_playing = false;
  	};


  	var setNextTick = function() {
  		var current_index = control_obj.getSortedIndex();
  		var current_delay = timesteps[current_index];
  		var final_index = control_obj.n_options - 1;
  		var next_index = current_index < final_index ? current_index + 1 : 0;

  		timer_id = setTimeout(function() {
  			sliderChangeFunction(next_index);
  			if (state.slider_loop || next_index < final_index) setNextTick();
  			else stopSliderPlayer();
  		}, current_delay);
  	};


  	var startSliderPlayer = function() {
  		slider_holder.classed("playing", true);
  		slider_play_button.html(pause_string);
  		setNextTick();
  		control_obj._isPlaying_(true);
  		is_playing = true;
  	};


  	slider_play_button.on("click", function() {
  		if (timer_id === null) startSliderPlayer();
  		else stopSliderPlayer();
  	});


  	var setWidths = function() {
  		var handle_radius = Math.round(remToPx(state.slider_handle_height) / 2);
  		slider_holder.style("width", Math.round(remToPx(state.slider_width)) + "px");
  		slider_play_button
  			.style("height", handle_radius * 2 + "px")
  			.style("width", handle_radius * 2 + "px")
  			.style("display", state.slider_play_button ? null : "none");
  		var holder_width = slider_holder.node().getBoundingClientRect().width;
  		var button_width = slider_play_button.node().getBoundingClientRect().width;
  		slider_div
  			.style("width", Math.max((holder_width - button_width), 1) + "px")
  			.style("height", handle_radius * 2 + "px");

  		slider
  			.handleRadius(handle_radius)
  			.margin({
  				left: handle_radius + 5,
  				right: handle_radius + remToPx(state.slider_margin),
  				top: handle_radius
  			});
  	};


  	var setHandles = function() {
  		if (state.slider_play_button) {
  			slider_holder.classed("animatable", true);
  		}
  		else {
  			stopSliderPlayer();
  			slider_holder.classed("animatable", false);
  		}
  		if (handle_color !== state.slider_handle_color) {
  			slider.update(); // Make sure slider-handle actually exists before changing its colour
  			handle_color = state.slider_handle_color || "currentColor";
  			slider_holder.select(".slider-handle").style("fill", handle_color);
  			play_string = createPlayButton(handle_color);
  			pause_string = createPauseButton(handle_color);
  			slider_play_button.html(timer_id ? pause_string : play_string);
  		}
  	};


  	var showControl = function() {
  		slider_holder.style("display", "inline-block");
  		setWidths();
  		setHandles();
  		return slider_obj;
  	};

  	var hideControl = function() {
  		stopSliderPlayer();
  		slider_holder.style("display", "none");
  		return slider_obj;
  	};

  	slider_obj.show = showControl;
  	slider_obj.hide = hideControl;


  	slider_obj.update = function(_sorted_options) {
  		sorted_options = _sorted_options;
  		if (!control_obj.n_options || state.control_type !== "slider") {
  			hideControl();
  			return slider_obj;
  		}

  		showControl();

  		var n_options = control_obj.n_options;
  		var loop = state.slider_loop;

  		timesteps = sorted_options.map(function(d, i) {
  			var dur_in_seconds = state.slider_step_time + (loop && i === (n_options -1) ? state.slider_restart_pause : 0);
  			return dur_in_seconds * 1000;
  		});

  		var sorted_index = control_obj.getSortedIndex();
  		var d = sorted_options[sorted_index];

  		slider.domain([0, n_options - 1])
  			.value(sorted_index)
  			.endLabel(d.display)
  			.channelHeight(Math.round(remToPx(state.slider_track_height)))
  			.channelFill(state.slider_background_color)
  			.update();

  		slider.container.select("svg").attr("fill", "currentColor");

  		slider_div.select("text.slider-end-labels")
  			.style("fill", state.slider_font_color)
  			.attr("y", "0")
  			.attr("dy", "0.25em");


  		if (control_obj._isPlaying_() && !is_playing) startSliderPlayer();
  		else if (!control_obj._isPlaying_() && is_playing) stopSliderPlayer();

  		return slider_obj;
  	};


  	return slider_obj;
  }

  var DEFAULTS = Object.freeze({
  	control_type: "dropdown",
  	control_title: "",

  	// Dropdown
  	dropdown_width_mode: "auto",
  	dropdown_width_fixed: 20,

  	// Buttons
  	button_group: true,
  	button_group_width_mode: "fixed",
  	button_group_width_fixed: 20,

  	// Slider
  	slider_width: 15,
  	slider_handle_color: null,
  	slider_font_color: null,
  	slider_background_color: "#dddddd",

  	slider_handle_height: 1,
  	slider_track_height: 0.2,
  	slider_margin: 4.5,

  	slider_play_button: true,
  	slider_step_time: 2,
  	slider_loop: true,
  	slider_restart_pause: 0,

  	// Data typing
  	sort: false,

  	_index_: null,
  	_is_playing_: false
  });

  function defaultParser(x) {
  	return x;
  }

  function defaultFormatter(x) {
  	return x == null ? "" : x.toString();
  }

  function init(state) {
  	var control_obj = {};
  	var parser = defaultParser;
  	var formatter = defaultFormatter;
  	var options = [];
  	var sorted_options = [];
  	var changeHandlers = [];
  	var container = document.createElement("div");
  	container.setAttribute("class", "fl-controls-container");
  	var container_title = select(container).append("div").attr("class", "fl-controls-title");
  	var dropdown_obj = createDropdown(control_obj, state, container);
  	var buttons_obj = createButtons(control_obj, state, container);
  	var slider_obj = createSlider(control_obj, state, container);

  	for (var key in DEFAULTS) {
  		if (state[key] === undefined) state[key] = DEFAULTS[key];
  	}

  	var current_index = state._index_;

  	var checkValidIndex = function(i) {
  		return options.length && i >= 0 && i < options.length;
  	};

  	var updateControls = function(sorted_options) {
  		container.style.display = (sorted_options.length > 1) ? null : "none";
  		container.style.width = "";
  		container_title.node().innerHTML = state.control_title;
  		container_title.node().style.display = (state.control_title === "") ? "none" : "inline-block";
  		slider_obj.update(sorted_options); // Do slider first in case we're stopping playing
  		dropdown_obj.update(sorted_options);
  		buttons_obj.update(sorted_options);
  	};

  	control_obj.appendTo = function(parent_container, bounding_container) {
  		injectCSS();
  		select(parent_container).node().appendChild(container);
  		dropdown_obj.appendedToDOM(bounding_container);
  		return control_obj;
  	};

  	var callOnChangeCallbacks = function() {
  		var index = indexFunction();
  		var value = options[index];
  		changeHandlers.forEach(function(func) {
  			func(value, index);
  		});
  		return control_obj;
  	};

  	control_obj.remove = function() {
  		if (container.parentElement) container.parentElement.removeChild(container);
  		dropdown_obj.removedFromDOM();

  		return control_obj;
  	};

  	control_obj.options = function(arr) {
  		if (arr === undefined) return options.slice();
  		if (!Array.isArray(arr)) return control_obj;
  		options = arr.slice();
  		var n = options.length;
  		var i = indexFunction();
  		if (!n) indexFunction(null);
  		else if (i === null || i >= n) indexFunction(0);
  		return control_obj;
  	};

  	Object.defineProperty(control_obj, "n_options", { get: function() { return options.length; } });


  	var indexFunction = function(i) {
  		if (i === undefined) {
  			if (!state._is_playing_) current_index = state._index_;
  			return current_index;
  		}
  		if (i === null || checkValidIndex(i)) {
  			current_index = i;
  			if (!state._is_playing_) state._index_ = current_index;
  		}
  		else console.warn("Invalid index, ignoring update call");
  		return control_obj;
  	};
  	control_obj.index = indexFunction;

  	control_obj.getSortedIndex = function() {
  		var options_index = indexFunction();
  		if (state.sort == "unsorted") return options_index;
  		var sorted_index;
  		sorted_options.some(function(d, i) {
  			if (d.options_index === options_index) {
  				sorted_index = i;
  				return true;
  			}
  		});
  		return sorted_index;
  	};

  	control_obj.value = function(value) {
  		if (value === undefined) return options[indexFunction()];
  		var index = options.indexOf(value);
  		if (index !== -1) indexFunction(index);
  		return control_obj;
  	};

  	control_obj.on = function(event, callback) {
  		if (event === "change") changeHandlers.push(callback.bind(control_obj));
  		return control_obj;
  	};

  	control_obj.parser = function (value) {
  		if (value === undefined) return parser;
  		if (value === null) parser = defaultParser;
  		else parser = value;
  		return control_obj;
  	};

  	control_obj.formatter = function (value) {
  		if (value === undefined) return formatter;
  		if (value === null) formatter = defaultFormatter;
  		else formatter = value;
  		return control_obj;
  	};

  	control_obj.update = function() {
  		getRemToPx();
  		sorted_options = sortArray(options, state.sort, parser, formatter);
  		updateControls(sorted_options);
  		return control_obj;
  	};

  	control_obj.trigger = function(event) {
  		if (event === "change") callOnChangeCallbacks();
  		return control_obj;
  	};

  	control_obj.getNode = function() {
  		return container;
  	};

  	var isPlaying = function(is_playing) {
  		if (is_playing === undefined) return state._is_playing_;
  		state._is_playing_ = !!is_playing;
  		if (!is_playing) indexFunction(current_index); // Force _index_ to match current index
  	};

  	control_obj._isPlaying_ = isPlaying;

  	return control_obj;
  }

  return init;

})));