function mapValueChanged (ui, context) {
    const { active } = color
    if (context !== colorMap && isNullish(active.val())) return
    const xy = ui.val('all')
    switch (settings.color.mode) {
      case 'h':
        active.val('sv', { s: xy.x, v: 100 - xy.y }, context)
        break
      case 's':
      case 'a':
        active.val('hv', { h: xy.x, v: 100 - xy.y }, context)
        break
      case 'v':
        active.val('hs', { h: xy.x, s: 100 - xy.y }, context)
        break
      case 'r':
        active.val('gb', { g: 255 - xy.y, b: xy.x }, context)
        break
      case 'g':
        active.val('rb', { r: 255 - xy.y, b: xy.x }, context)
        break
      case 'b':
        active.val('rg', { r: xy.x, g: 255 - xy.y }, context)
        break
    }
  }
User has dragged the ColorMap pointer.
@param {external:jQuery} ui
@param {?module:jPicker.Slider} context
@returns {void}