@plotdb/chart 0.0.2

package/src/utils/axis.ls

@@ -0,0 +1,229 @@
+ceNS = -> document.createElementNS("http://www.w3.org/2000/svg", it)
+
+axis = (opt={}) ->
+  @dir = {"bottom": 0, "left": 2}[opt.direction or 'bottom']
+  @name = opt.name or \axis
+  # unlike legend, we don't use n.layout to layout things, only use its primary size.
+  # we will update n.layout's secondary size, it won't affect how we layout things.
+  # so we don't need layout.update before rendering.
+  # layout.update is still needed after rendering for stuff outside axis to work.
+  # TODO still yaxis and xaxis may affect each other to cause a recursive update,
+  # so we have to be careful and have some constraint over this. (e.g., set max size of n.layout)
+  @layout = opt.layout or new layout root: @root
+  @_ticks = []
+  @_scale = opt.scale or (->it)
+  @_format = opt.format or if chart? => chart.utils.format.simple else (->it)
+  @cfg = {tick-size: 8} <<< opt.cfg
+  @_map = {}                           # tick value -> object{v,c,t,n,g}
+  @_n = n =
+    root: ceNS \g                      # root node, appended to render node
+    layout: @layout.get-node(@name)    # decide render region size
+    render: @layout.get-group(@name)   # render region node
+    wrap: null                         # for wrapping tick text
+    domain: ceNS \path                 # axis domain line
+  n.render.appendChild n.root
+  n.root.appendChild n.domain
+
+  n.label = ceNS \text
+  n.label.textContent = ''
+  n.label
+    ..setAttribute \dominant-baseline, \hanging
+    ..setAttribute \text-anchor, \middle
+  n.root.appendChild n.label
+  @wrapper!
+  @layout
+    ..on \update, ~> @update!
+    ..on \render, ~> @render!
+  @
+
+
+axis.prototype = Object.create(Object.prototype) <<< do
+  # while we may only need to update `white-space` and `width`,
+  # strangely style changing only works if we replace node with a new one.
+  # this is a workaround before we find the root cause.
+  wrapper: ->
+    n = @_n
+    if n.wrap and n.wrap.parentNode => n.wrap.parentNode.removeChild n.wrap
+    n.wrap = document.createElement \div
+    n.wrap.style <<< {
+      visibility: \hidden
+      position: \absolute
+      top: 0
+      left: 0
+      pointerEvents: \none
+      userSelect: \none
+      zIndex: 0
+      wordBreak: "break-all"
+      lineHeight: \.95em
+    } <<< (if @dir < 2 and @cfg.textWidth? => {
+      whiteSpace: 'wrap'
+      width: "#{@cfg.textWidth >? 1}em"
+    } else {whiteSpace: \pre, width: \4em})
+    n.layout.appendChild n.wrap
+
+  config: ->
+    if !(it?) => return @cfg
+    @cfg <<< it
+    if @cfg.format => @format @cfg.format
+    @wrapper!
+
+  format: -> if it? => @_format = it else @_format
+  scale: -> if it? => @_scale = it else @_scale
+  caption: ->
+    if @cfg.show-caption? and !@cfg.show-caption => @_n.label.textContent = ''
+    else @_n.label.textContent = it
+  update: ->
+  ticks: (ticks) ->
+    /* (v)alue -> (c)oordinate -> (t)ext -> (n)odes: { g(group), p(path), t(text) } */
+    map = {}
+    size = @_n.layout.getBoundingClientRect![if @dir < 2 => \width else \height]
+    count = Math.round(size / 25)
+    itr = Math.round(ticks.length / (count >? 1)) >? 1
+    @_ticks = ticks
+      .filter (d,i) -> !(i % itr) or i == (ticks.length - 1)
+      .map (o) ~>
+        if typeof(o) != \object => o = {v: o}
+        map[o.v] = @_map{}[o.v] <<< o
+    for k,v of @_map => if !map[k] => v.n.g.parentNode.removeChild v.n.g
+    @_map = map
+    @_ticks
+      .filter (o) -> !o.n
+      .map (o) ~>
+        o.n = g: ceNS(\g), p: ceNS(\path), t: ceNS(\g)
+        o.n.g.appendChild o.n.p
+        o.n.g.appendChild o.n.t
+        @_n.root.appendChild o.n.g
+        if isNaN(+o.v) => o.t = o.v
+
+  render: ->
+    n = @_n
+    is-horizon = (@dir < 2)
+    wrap = n.wrap
+    ticks = @_ticks
+    if @cfg.enabled? and !@cfg.enabled =>
+      if is-horizon => n.layout.style <<< height: "0px", paddingTop: "0", paddingBottom: "0"
+      else n.layout.style <<< width: "0px", paddingLeft: "0", paddingRight: "0"
+      n.domain.style.display = 'none'
+      return
+    else
+      if is-horizon => n.layout.style <<< height: "", paddingTop: "", paddingBottom: ""
+      else n.layout.style <<< width: "", paddingLeft: "", paddingRight: ""
+      n.domain.style.display = ''
+    font-size = getComputedStyle(wrap).font-size
+    box = n.layout.getBoundingClientRect!
+    n.domain.style <<< strokeWidth: 1, stroke: \currentColor, fill: \none
+    ticks.map (o, idx) ~>
+      pos = if !idx => 0 else if idx == ticks.length - 1 => 2 else 1
+      o._c = if o.c? => o.c else @_scale(o.v) + (if @_scale.bandwidth => @_scale.bandwidth!/2 else 0)
+      o._t = if o.t? => o.t else @_format o.v
+      o.n.p.style <<< strokeWidth: 1, stroke: \currentColor, fill: \none
+      wrap.textContent = o._t
+      wrap.style.textAlign = if is-horizon => <[left center right]>[pos] else <[right left]>[@dir - 2]
+      o.n.tt = wrap-svg-text {node: wrap}
+      o.n.t.style.font-size = font-size
+      o.n.t.textContent = ''
+      o.n.t.appendChild o.n.tt
+    ticks.sort (a,b) -> a._c - b._c
+
+    if is-horizon =>
+      n.domain.setAttribute \d, "M0 0L#{box.width} 0Z"
+      n.label.setAttribute \x, box.width / 2
+    else
+      n.domain.setAttribute \d, "M0 0L0 #{box.height}Z"
+      n.label.setAttribute "transform", "translate(0,#{box.height/2}) rotate(90)"
+    ticks.map (o) -> o.box = o.n.t.getBBox!
+    @adjust!
+
+  adjust: ->
+    ticks = @_ticks
+    is-horizon = (@dir < 2)
+    insert = (idx, lv, lc) ~>
+      if lc.checked[idx] => return else lc.checked[idx] = true
+      tick = ticks[idx]
+      # 0: smallest 'screen coord' tick / 1: middle tick / 2: biggest 'screen coord' tick
+      # top(0) -> down(2) / left(0) -> right(0)
+      pos = if !idx => 0 else if idx == ticks.length - 1 => 2 else 1
+
+      [coord,text] = [tick._c, tick._t]
+      box = tick.box
+      offset = {x: -box.x, y: -box.y}
+      do-offset = if @_scale.bandwidth => false
+      else if @cfg.boundary-tick-offset? => !!@cfg.boundary-tick-offset
+      else if @dir < 2 => true else false
+      r = if do-offset => pos/2 else 1/2
+      if is-horizon => offset.x -= box.width * r # start: 0w, middle: -.5w, end: -w ( left to right )
+      else offset.y -= box.height * r # start: 0h, middle: .5h, end: -h ( top to bottom )
+      tick.n.tt.setAttribute \transform, "translate(#{offset.x},#{offset.y})"
+
+      box =
+        size: box[if is-horizon => \width else \height]
+        size-alt: box[if is-horizon => \height else \width]
+        lv: lv, tick: tick, idx: idx
+      box.coord = coord - (box.size * r) #(if is-horizon => pos else (2 - pos)) / 2)
+
+      if is-horizon =>
+        tick.n.g.setAttribute \transform, "translate(#{coord},0)"
+        tick.n.p.setAttribute \d, "M0 0L0 #{@cfg.tick-size}"
+        tick.n.t.setAttribute \transform, "translate(0,#{@cfg.tick-size})"
+      else
+        tick.n.g.setAttribute \transform, "translate(0,#{coord})"
+        tick.n.p.setAttribute \d, "M0 0L-#{@cfg.tick-size} 0"
+        tick.n.t.setAttribute \transform, "translate(#{-@cfg.tick-size - box.size-alt - 1},0)"
+
+      m = 2
+      [ip1, ip2] = [ box.coord, box.coord + box.size ]
+      [op1, op2] = [ ip1 - m, ip2 + m]
+
+      overlap = lc.picked
+        .filter (b) ->
+          [iq1, iq2] = [b.coord, b.coord + b.size]
+          [oq1, oq2] = [iq1 - m, iq2 + m]
+          return (ip1 > oq1 and ip1 < oq2) or (iq1 > op1 and iq1 < op2)
+        .length
+
+      tick.n.t.style.opacity = if overlap => 0 else 1
+      lc.picked.push box
+      return !overlap # return true if insert successfully
+
+    # align lv ( see below commented codes )
+    # try to only show ticks in the same level.
+    # yet current implementation doesn't work well
+    # since we may have different size in each interval even in the same level
+
+    bfs = (maxlv = 1) ~>
+      [lc,fifo] = [{checked:{}, picked: [], node: @_n.wrap}, []]
+      lc.font-size = getComputedStyle(lc.node).font-size
+      # align lv
+      ticks.map -> it.n.t.style.opacity = 0
+      if ticks.length =>
+        fifo.push [0, ticks.length - 1, 0]
+        [0, ticks.length - 1].map -> insert it, 0, lc
+      while fifo.length =>
+        [L, R, D] = fifo.splice 0, 1 .0
+        if D >= maxlv => continue
+        M = Math.floor(( L + R ) / 2)
+        # align lv
+        #if !insert(M, D, lc) => maxlv = D
+        insert(M, D, lc)
+        if M > L + 1 => fifo.push [L, M, D + 1]
+        if R > M + 1 => fifo.push [M, R, D + 1]
+
+      /* align lv
+      lc.picked.map -> if it.lv >= maxlv => it.tick.n.t.style.opacity = 0
+      lc.picked = lc.picked.filter -> it.lv < maxlv
+      */
+
+      size = Math.max.apply(Math, [0] ++ lc.picked.map(-> it.size-alt))
+      if @dir < 2 =>
+        @_n.label.setAttribute \y, size + @cfg.tick-size
+        @_n.layout.style.height = "#{(size + @cfg.tick-size + @_n.label.getBoundingClientRect!height)}px"
+      else
+        @_n.label.setAttribute \x, 0
+        @_n.label.setAttribute \y, 0
+        @_n.layout.style.width = "#{(size + @cfg.tick-size + @_n.label.getBoundingClientRect!width)}px"
+        box = @_n.layout.getBoundingClientRect!
+        @_n.label.setAttribute \transform, "translate(#{-(size + @cfg.tick-size)},#{box.height/2}) rotate(90)"
+        @_n.root.setAttribute \transform "translate(#{box.width},0)"
+    bfs 5
+
+if chart? => chart.{}utils.axis = axis

package/src/utils/config.ls

@@ -0,0 +1,11 @@
+config = preset:
+  default:
+    margin: type: \number
+    font:
+      size: type: \number, min: 1, max: 256, step: 1, default: 16
+    color: type: \color
+    palette: type: \palette
+    background: type: \color
+
+if chart? => chart.{}utils.config = config
+

package/src/utils/data.ls

@@ -0,0 +1,104 @@
+main = 
+  number: (opt = {}) ->
+    data = opt.data
+      .filter -> !(!it or "#{it}".trim! == '')
+    len = data
+      .filter -> !isNaN(parseFloat(it))
+      .length
+    (len / data.length)
+
+  serial: (opt = {}) ->
+    data = [] ++ opt.data
+    data.sort (a,b) -> b - a
+    hash = {}
+    for i from 1 til data.length =>
+      if isNaN(data[i]) or isNaN(data[i - 1]) =>
+        hash[if data[i] > data[i - 1] => "#{data[i]}:#{data[i - 1]}" else "#{data[i - 1]}:#{data[i]}"] = true
+      else delta = data[i] - data[i - 1]
+      hash[delta] = true
+    return 1 / ([k for k of hash].filter(->it != \0).length or 2)
+
+  text: (opt={}) -> 1 - (@number opt)
+
+  category: (opt={}) ->
+    len = Array.from(new Set(opt.data)).length 
+    maxlen = opt.data.length
+    ret = (1 - (((len - 2) >? 0) / maxlen) - (1 / maxlen)) >? 0 <? 1
+    if @number(opt) => ret = ret * 0.9
+    return ret
+
+  parse: (data) ->
+    if Array.isArray(data) =>
+      head = data.slice 0, 1 .0
+      body = data.slice 1
+      body = body.map (d,i) ->
+        ret = {}
+        head.map (h,j) -> ret[h] = d[j]
+        ret
+      return {head, body}
+    return data
+
+  autotype: (data = []) ->
+    head = [k for k of data.0 or {}]
+    type = []
+    for key in head =>
+      d = data.map -> it[key]
+      ret = do
+        key: key
+        types:
+          R: main.number({data: d})
+          O: main.serial({data: d})
+          N: main.text({data: d})
+          C: main.category({data: d})
+      list = <[R O N C]>.map -> [it, ret.types[it]]
+      list.sort (a,b) -> b.1 - a.1
+      ret.type = list.0.0
+      type.push ret
+
+    return type
+
+  autobind: (data = [], dimension = {}) ->
+    datatypes = @autotype data
+    dims = [{k,v} for k,v of dimension].filter -> !it.v.passive
+    dims.sort (a,b) ->
+      ret = (a.v.priority or 100) - (b.v.priority or 100)
+      if ret != 0 => return ret
+      [ma,mb] = [(a.v.type or \R), (b.v.type or \R)].map (t) ->
+        Math.min.apply Math, [0 til t.length].map (i) -> "CONR".indexOf(t[i])
+      return ma - mb
+    for dim in dims =>
+      dim.bind = null
+      ts = dim.v.type or \RNOC
+      for i from 0 til ts.length =>
+        t = ts[i]
+        datatypes.sort (a, b) ->
+          ret = (b.types[t] or 0) - (a.types[t] or 0)
+          if b.types[t] == a.types[t] and t == \R => return (a.types.O or 0) - (b.types.O or 0)
+          return ret
+        for i from 0 til datatypes.length =>
+          dt = datatypes[i]
+          if dt.types[t] < 0.5 or dt.used or (t == \C and dt.types.R > 0.5) => continue
+          dim.bind = if dim.v.multiple => [dt] else dt
+          dt.used = true
+          break
+    for dim in dims =>
+      if !dim.v.multiple => continue
+      ts = dim.v.type or \RNOC
+      for i from 0 til ts.length =>
+        t = ts[i]
+        datatypes.sort (a, b) ->
+          ret = (b[t] or 0) - (a[t] or 0)
+          if b[t] == a[t] and t == \R => return (a.O or 0) - (b.O or 0)
+          return ret
+        for i from 0 til datatypes.length =>
+          dt = datatypes[i]
+          if dt.types[t] < 0.5 or dt.used or (t == \C and dt.types.R > 0.5) => continue
+          dim.bind.push dt
+          dt.used = true
+    ret = {}
+    for dim in dims => if dim.bind =>
+      ret[dim.k] = dim.bind
+      (if Array.isArray(dim.bind) => dim.bind else [dim.bind]).map -> delete it.used
+    return ret
+
+if chart? => chart.{}utils.data = main

package/src/utils/format.ls

@@ -0,0 +1,30 @@
+format = {}
+format.auto = (list = []) ->
+  return d3.format ".3s"
+  list = list.map(->+it).filter -> !isNaN(it)
+  if !list.length => return d3.format "d"
+  list.sort (a,b) -> a - b
+  s = Math.max.apply Math, list.map ->
+    s = 1
+    while it
+      if it % 10 => break
+      it = Math.floor(it / 10)
+      s++
+    Math.ceil((Math.log(it or 1) / Math.log(10)) - s) >? 0
+  int-rate = list.filter(-> Math.floor(it) == it).length / list.length
+  diffs = [Math.abs(list[i] - list[i - 1]) for i from 1 til list.length].map ->
+    Math.log(if it => it else 1) / Math.log(10)
+  diff-avg = diffs.reduce(((a,b) -> a + b),0) / list.length
+  type = if int-rate > 0.9 => "s" else "f"
+  size = (if diff-avg >= 0 => (s >? 0) else Math.ceil(Math.abs(diff-avg)))
+  return d3.format ".#size#type"
+
+format.simple = (v) ->
+  if isNaN(v = +v) => return v
+  return if v >= 1000000000 => (v / 1000000000).toFixed(0) + "G"
+  else if v >= 1000000 => (v / 1000000).toFixed(0) + "M"
+  else if v >= 1000 => (v / 1000).toFixed(0) + "K"
+  else if Math.floor(v) == v => (v).toFixed(0)
+  else v.toFixed(2)
+
+if chart? => chart.{}utils.format = format

package/src/utils/legend.ls

@@ -0,0 +1,134 @@
+svgns = "http://www.w3.org/2000/svg"
+
+legend = (opt = {}) ->
+  @_data = opt.data or []
+  @name = opt.name or \legend
+  @cfg = opt.cfg or {}
+  @root = if typeof(opt.root) == \string => document.querySelector(opt.root) else opt.root
+  @dir = opt.direction or 'vertical'
+  @evt-handler = {}
+  @_picked = Object.fromEntries @_data.map -> [it.key, true]
+  @layout = opt.layout or new layout root: @root
+  @layout
+    ..on \update, ~> @update!
+    ..on \render, ~> @render!
+  @id = Math.random!toString(36)substring(2)
+  node-layout = @layout.get-node @name
+  node-render = @layout.get-group @name
+  if !node-layout.querySelector('[ld-each=legend]') =>
+    node-layout.innerHTML = """
+    <div class="pdlg #{@dir}">
+      <div ld-each="legend">
+        <div class="pdl-cell" ld="shape" data-only></div>
+        <div class="pdl-cell" ld="text" data-only></div>
+      </div>
+    </div>
+    """
+  if !node-render.querySelector('[ld-each=legend]') =>
+    gl = document.createElementNS(svgns, "g")
+    gs = document.createElementNS(svgns, "g")
+    gt = document.createElementNS(svgns, "g")
+    gl.classList.add \pdlg-g
+    gl.setAttribute \ld-each, \legend
+    gs.setAttribute \ld, \shape
+    gt.setAttribute \ld, \text
+    gl.appendChild gs
+    gl.appendChild gt
+    node-render.appendChild gl
+
+  @_func = [
+    {key: "all", type: "func", text: "全選"}
+    {key: "none", type: "func", text: "全不選"}
+  ]
+
+  @view =
+    layout: new ldview do
+      root: @layout.get-node @name
+      init-render: false
+      handler:
+        legend:
+          list: ~> @_data ++ (if @cfg.selectable => @_func else [])
+          key: -> it.key
+          view:
+            handler:
+              shape: ({node, ctx}) ~>
+                node.setAttribute \data-name, @_name ctx, "shape"
+              text: ({node, ctx}) ~>
+                node.setAttribute \data-name, @_name ctx, "text"
+                node.innerText = ctx.text
+
+
+    render: new ldview do
+      root: @layout.get-group @name
+      init-render: false
+      handler:
+        legend:
+          list: ~> @_data ++ (if @cfg.selectable => @_func else [])
+          key: -> it.key
+          view:
+            action: click: "@": ({node, ctx}) ~>
+              if !@cfg.selectable => return
+              if ctx.type == \func =>
+                for k of @_picked => @_picked[k] = if ctx.key == \all => true else false
+              else @_picked[ctx.key] = !@_picked[ctx.key]
+              @view.render.render \legend
+              @fire \select, @_picked
+            handler:
+              "@": ({node, ctx}) ~>
+                node.style.opacity = if !@cfg.selectable or ctx.type == \func or (@_picked[ctx.key]) => 1 else 0.3
+              "shape": ({node, ctx}) ~>
+                if ctx.type == \func =>
+                  node.style.display = \none
+                  return
+                if !node.querySelector \circle => node.appendChild document.createElementNS(svgns, \circle)
+                n = node.querySelector \circle
+                box = @layout.get-box @_name(ctx, \shape)
+                rbox = @layout.get-box @name
+                n.setAttribute \cx, ".5em"
+                n.setAttribute \cy, ".5em"
+                n.setAttribute \r, ".5em"
+                n.setAttribute \transform, "translate(#{box.x - rbox.x}, #{box.y - rbox.y})"
+                if typeof(opt.shape) == \function => opt.shape.call n, ctx
+
+              "text": ({node,ctx}) ~>
+                n = @layout.get-node(@_name ctx, \text)
+                nbox = @layout.get-box(@_name ctx, \text)
+                rbox = @layout.get-box(@name)
+                node.setAttribute \transform, "translate(#{nbox.x - rbox.x}, #{nbox.y - rbox.y})"
+                node.textContent = ""
+                ret = wrap-svg-text node: n, use-range: true
+                node.appendChild ret
+  @update!
+  @
+
+legend.prototype = Object.create(Object.prototype) <<< do
+  _name: (ctx,type="s") -> "pdlg-#{type}-#{@id}-#{ctx.type or ''}-#{ctx.key}"
+  enabled: -> @_data and @_data.length and (!(@cfg.enabled?) or @cfg.enabled)
+  update: ->
+    val = if @enabled! => '' else '0px'
+    @layout.get-node \legend .style <<< {width: val, height: val, padding: val, margin: val}
+    @view.layout.render!
+  render: ->
+    enabled = @enabled!
+    g = @layout.get-group(@name)
+    g.style.display = if enabled => '' else 'none'
+    if enabled => @view.render.render!
+  config: (cfg) ->
+    if !(cfg?) => return @cfg
+    @cfg = cfg
+    @dir = if @cfg.position == \bottom => \horizontal else \vertical
+    node = @layout.get-node(@name).querySelector \.pdlg
+    <[horizontal vertical]>.map ~> node.classList.toggle it, @dir == it
+  data: (data = []) ->
+    hash = {}
+    data.map (d,i) -> hash[d.key] = i
+    @_data = data.filter (d,i) -> hash[d.key] == i
+    @_picked = Object.fromEntries @_data.map (d) -> [d.key, true]
+    @update!
+    @layout.update false
+    @view.render.render!
+  on: (n, cb) -> (if Array.isArray(n) => n else [n]).map (n) ~> @evt-handler.[][n].push cb
+  fire: (n, ...v) -> for cb in (@evt-handler[n] or []) => cb.apply @, v
+  is-selected: (key) -> return !!@_picked[key]
+
+if chart? => chart.{}utils.legend = legend

package/src/utils/legend.styl

@@ -0,0 +1,37 @@
+.pdlg
+  height: 100%
+  width: 100%
+  display: flex
+  align-items: start
+  justify-content: center
+
+.pdlg > div
+  display: flex
+  align-items: center
+  line-height: 1em
+  [ld=shape]
+    display: inline-block
+    width: 1em
+    height: 1em
+    margin-right: .5em
+    background: #999
+    flex: 0 0 auto
+    line-height: 1em
+  [ld=text]
+    color: #999
+    padding-right: .25em
+    line-height: 1.2em
+
+.pdlg.vertical
+  flex-direction: column
+  align-items: start
+  & > div
+    margin-bottom: .5em
+
+.pdlg.horizontal
+  & > div
+    margin-right: .5em
+
+g.pdlg-g
+  cursor: pointer
+  transition: opacity .15s ease-in-out

package/src/utils/tint.ls

@@ -0,0 +1,66 @@
+tint = (opt = {}) ->
+  @is-unique = if opt.unique? => opt.unique else true
+  @map = {}  # calculated name to index map
+  @nmap = [] # predefined name to index map
+  @wm = new WeakMap!
+  @count = 0
+  @set opt.palette or opt.colors
+  @
+
+tint.default = <[#e15c64 #f7b26a #f3ed9d #a4bd81 #a0d7d2 #8db1da #daaedb]>
+
+tint.prototype = Object.create(Object.prototype) <<< do
+  set: (pal = [], reset = false) ->
+    @colors = if Array.isArray(pal) and pal.length => pal
+    else if pal.colors and Array.isArray(pal.colors) => pal.colors
+    else tint.default
+    @nmap = pal.maps or []
+    @colors = @colors.map -> it.value or it
+    if @colors.length == 1 => @colors.push ldcolor.complement(@colors.0)
+    @colors = @colors.map -> ldcolor.hsl(it)
+    @len = @colors.length >? 2
+    if reset => @reset!
+    else @nmap.map (d,i) ~> (if Array.isArray(d) => d else [d]).map ~> @get it, 0, i
+
+  unique: -> return if it? => @is-unique = !!it else @is-unique
+  reset: ->
+    @map = {}
+    @wm = new WeakMap!
+    @count = 0
+    (@nmap or []).map (d,i) ~> (if Array.isArray(d) => d else [d]).map ~> @get it, 0, i
+  get: (data, variant = 0, idx) ->
+    if idx? =>
+      if @count < idx => @count = idx + 1
+      val = idx % @len
+      if typeof(data) == \object => @wm.set data, val
+      else @map[data] = val
+    else
+      if typeof(data) == \object =>
+        if !(val = @wm.get data)? => @wm.set data, (val = @count++)
+      else if !(val = @map[data])? => @map[data] = (val = @count++)
+      if !@is-unique => val = val % @len
+    if val >= @len =>
+      seg = val % ( @len - 1 )
+      pos = Math.floor(val / (@len - 1))
+      [fz,fm] = [0,1]
+      while pos > 0
+        [fz,fm] = [fz * 2, fm * 2]
+        if pos % 2 => fz += 1
+        pos = pos .>>. 1
+      pos = fz/fm
+      [c1,c2] = [@colors[seg], @colors[seg + 1]]
+      [h,s,l] = <[h s l]>.map (k) ->
+        pos * (c2[k] - c1[k]) + c1[k]
+      ret = {h,s,l}
+    else ret = @colors[val]
+    if variant > 0 => ret = ldcolor.lighter(ret, variant)
+    else if variant < 0 => ret = ldcolor.darker(ret, -variant)
+    return ldcolor.web(ret)
+
+  text: (v, opt = {}) ->
+    hcl = ldcolor.hcl(@get v)
+    return ldcolor.web(if hcl.l > 50 => (opt.text-dark or \#000) else (opt.text-light or \#fff))
+
+
+
+if chart? => chart.{}utils.tint = tint