_paint_levels(ctx: Context2d, levels, clip_region = null) {
    ctx.save();

    if ((clip_region != null) && (this.model.plot.output_backend === "canvas")) {
      ctx.beginPath();
      ctx.rect.apply(ctx, clip_region);
      ctx.clip();
    }

    const indices = {};
    for (let i = 0; i < this.model.plot.renderers.length; i++) {
      const renderer = this.model.plot.renderers[i];
      indices[renderer.id] = i;
    }

    const sortKey = renderer_view => indices[renderer_view.model.id];

    for (const level of levels) {
      const renderer_views = sortBy(values(this.levels[level]), sortKey);

      for (const renderer_view of renderer_views) {
        renderer_view.render();
      }
    }

    return ctx.restore();
  }

  protected _paint_levels(ctx: Context2d, levels: string[], clip_region?: FrameBox): void {
    ctx.save()

    if (clip_region != null) {
      ctx.beginPath()
      ctx.rect.apply(ctx, clip_region)
      ctx.clip()
    }

    const indices: {[key: string]: number} = {}
    for (let i = 0; i < this.model.plot.renderers.length; i++) {
      const renderer = this.model.plot.renderers[i]
      indices[renderer.id] = i
    }

    const sortKey = (renderer_view: RendererView) => indices[renderer_view.model.id]

    for (const level of levels) {
      const renderer_views = sortBy(values(this.levels[level]), sortKey)

      for (const renderer_view of renderer_views) {
        renderer_view.render()
      }
    }

    ctx.restore()
  }

  protected _merge_tools(): void {
    // Go through all the tools on the toolbar and replace them with
    // a proxy e.g. PanTool, BoxSelectTool, etc.
    this._proxied_tools = []

    const inspectors: {[key: string]: InspectTool[]} = {}
    const actions: {[key: string]: ActionTool[]} = {}
    const gestures: {[key: string]: {[key: string]: GestureTool[]}} = {}

    const new_help_tools = []
    const new_help_urls = []
    for (const helptool of this.help) {
      if (!includes(new_help_urls, helptool.redirect)) {
        new_help_tools.push(helptool)
        new_help_urls.push(helptool.redirect)
      }
    }
    this._proxied_tools.push(...new_help_tools)
    this.help = new_help_tools

    for (const event_type in this.gestures) {
      const gesture = this.gestures[event_type as GestureType]
      if (!(event_type in gestures)) {
        gestures[event_type] = {}
      }
      for (const tool of gesture.tools) {
        if (!(tool.type in gestures[event_type])) {
          gestures[event_type][tool.type] = []
        }
        gestures[event_type][tool.type].push(tool)
      }
    }

    for (const tool of this.inspectors) {
      if (!(tool.type in inspectors)) {
        inspectors[tool.type] = []
      }
      inspectors[tool.type].push(tool)
    }

    for (const tool of this.actions) {
      if (!(tool.type in actions)) {
        actions[tool.type] = []
      }
      actions[tool.type].push(tool)
    }

    // Add a proxy for each of the groups of tools.
    const make_proxy = (tools: ButtonTool[], active: boolean = false) => {
      const proxy = new ToolProxy({tools, active})
      this._proxied_tools.push(proxy)
      return proxy
    }

    for (const event_type in gestures) {
      const gesture = this.gestures[event_type as GestureType]
      gesture.tools = []

      for (const tool_type in gestures[event_type]) {
        const tools = gestures[event_type][tool_type]

        if (tools.length > 0) {
          const proxy = make_proxy(tools)
          gesture.tools.push(proxy as any)
          this.connect(proxy.properties.active.change, this._active_change.bind(this, proxy))
        }
      }
    }

    this.actions = []
    for (const tool_type in actions) {
      const tools = actions[tool_type]

      if (tools.length > 0)
        this.actions.push(make_proxy(tools) as any) // XXX
    }

    this.inspectors = []
    for (const tool_type in inspectors) {
      const tools = inspectors[tool_type]

      if (tools.length > 0)
        this.inspectors.push(make_proxy(tools, true) as any) // XXX
    }

    for (const et in this.gestures) {
      const gesture = this.gestures[et as GestureType]
      if (gesture.tools.length == 0)
        continue

      gesture.tools = sortBy(gesture.tools, (tool) => tool.default_order)

      if (!(et == 'pinch' || et == 'scroll' || et == 'multi'))
        gesture.tools[0].active = true
    }
  }

  _merge_tools() {
    // Go through all the tools on the toolbar and replace them with
    // a proxy e.g. PanTool, BoxSelectTool, etc.

    let active, tools;
    this._proxied_tools = [];

    const inspectors = {};
    const actions = {};
    const gestures = {};

    const new_help_tools = [];
    const new_help_urls = [];
    for (const helptool of this.help) {
      if (!includes(new_help_urls, helptool.redirect)) {
        new_help_tools.push(helptool);
        new_help_urls.push(helptool.redirect);
      }
    }
    this._proxied_tools.push(...new_help_tools || []);
    this.help = new_help_tools;

    for (const event_type in this.gestures) {
      const info = this.gestures[event_type];
      if (!(event_type in gestures)) {
        gestures[event_type] = {};
      }
      for (const tool of info.tools) {
        if (!(tool.type in gestures[event_type])) {
          gestures[event_type][tool.type] = [];
        }
        gestures[event_type][tool.type].push(tool);
      }
    }

    for (const tool of this.inspectors) {
      if (!(tool.type in inspectors)) {
        inspectors[tool.type] = [];
      }
      inspectors[tool.type].push(tool);
    }

    for (const tool of this.actions) {
      if (!(tool.type in actions)) {
        actions[tool.type] = [];
      }
      actions[tool.type].push(tool);
    }

    // Add a proxy for each of the groups of tools.
    const make_proxy = (tools, active = false) => {
      const proxy = new ToolProxy({tools, active});
      this._proxied_tools.push(proxy);
      return proxy;
    };

    for (const event_type in gestures) {
      this.gestures[event_type].tools = [];
      for (const tool_type in gestures[event_type]) {
        tools = gestures[event_type][tool_type];
        if (tools.length > 0) {
          const proxy = make_proxy(tools);
          this.gestures[event_type].tools.push(proxy);
          this.connect(proxy.properties.active.change, this._active_change.bind(this, proxy));
        }
      }
    }

    this.actions = [];
    for (const tool_type in actions) {
      tools = actions[tool_type];
      if (tools.length > 0) {
        this.actions.push(make_proxy(tools));
      }
    }

    this.inspectors = [];
    for (const tool_type in inspectors) {
      tools = inspectors[tool_type];
      if (tools.length > 0) {
        this.inspectors.push(make_proxy(tools, (active=true)));
      }
    }

    for (const et in this.gestures) {
      ({ tools } = this.gestures[et]);
      if (tools.length === 0) {
        continue;
      }
      this.gestures[et].tools = sortBy(tools, tool => tool.default_order);
      if (!(et == 'pinch' || et == 'scroll' || et == 'multi'))
        this.gestures[et].tools[0].active = true;
    }
  }

 const _widths = function(fmt_strings) {
   const sizes = (fmt_strings.map((fmt_string) => _strftime(now, fmt_string).length));
   const sorted = sortBy(zip(sizes, fmt_strings), function(...args) { const [size,] = args[0]; return size; });
   return unzip(sorted);
 };

  _init_tools() {
    for (const tool of this.tools) {
      if (tool instanceof InspectTool) {
        if (!any(this.inspectors, t => t.id === tool.id)) {
          this.inspectors = this.inspectors.concat([tool]);
        }
      } else if (tool instanceof HelpTool) {
        if (!any(this.help, t => t.id === tool.id)) {
          this.help = this.help.concat([tool]);
        }
      } else if (tool instanceof ActionTool) {
        if (!any(this.actions, t => t.id === tool.id)) {
          this.actions = this.actions.concat([tool]);
        }
      } else if (tool instanceof GestureTool) {
        let event_types = tool.event_type;
        let multi = true;
        if (typeof event_types === 'string') {
          event_types = [event_types];
          multi = false;
        }

        for (let et of event_types) {
          if (!(et in this.gestures)) {
            logger.warn(`Toolbar: unknown event type '${et}' for tool: ${tool.type} (${tool.id})`);
            continue;
          }

          if (multi)
            et = "multi"

          if (!any(this.gestures[et].tools, t => t.id === tool.id))
            this.gestures[et].tools = this.gestures[et].tools.concat([tool]);

          this.connect(tool.properties.active.change, this._active_change.bind(this, tool));
        }
      }
    }

    if (this.active_inspect === 'auto') {
      // do nothing as all tools are active be default

    } else if (this.active_inspect instanceof InspectTool) {
      this.inspectors.map(inspector => { if (inspector !== this.active_inspect) { return inspector.active = false; } });
    } else if (this.active_inspect instanceof Array) {
      this.inspectors.map(inspector => { if (!includes(this.active_inspect, inspector)) { return inspector.active = false; } });
    } else if (this.active_inspect === null) {
      this.inspectors.map(inspector => inspector.active = false);
    }

    const _activate_gesture = tool => {
      if (tool.active) {
        // tool was activated by a proxy, but we need to finish configuration manually
        return this._active_change(tool);
      } else {
        return tool.active = true;
      }
    };

    for (const et in this.gestures) {
      const { tools } = this.gestures[et];
      if (tools.length === 0) {
        continue;
      }
      this.gestures[et].tools = sortBy(tools, tool => tool.default_order);

      if (et === 'tap') {
        if (this.active_tap === null) {
          continue;
        }
        if (this.active_tap === 'auto') {
          _activate_gesture(this.gestures[et].tools[0]);
        } else {
          _activate_gesture(this.active_tap);
        }
      }

      if (et === 'pan') {
        if (this.active_drag === null) {
          continue;
        }
        if (this.active_drag === 'auto') {
          _activate_gesture(this.gestures[et].tools[0]);
        } else {
          _activate_gesture(this.active_drag);
        }
      }

      if (et == 'pinch' || et == 'scroll') {
        if ((this.active_scroll === null) || (this.active_scroll === 'auto')) {
          continue;
        }
        _activate_gesture(this.active_scroll);
      }
    }

    return null;
  }

  protected _init_tools(): void {
    for (const tool of this.tools) {
      if (tool instanceof InspectTool) {
        if (!any(this.inspectors, (t) => t.id == tool.id)) {
          this.inspectors = this.inspectors.concat([tool])
        }
      } else if (tool instanceof HelpTool) {
        if (!any(this.help, (t) => t.id == tool.id)) {
          this.help = this.help.concat([tool])
        }
      } else if (tool instanceof ActionTool) {
        if (!any(this.actions, (t) => t.id == tool.id)) {
          this.actions = this.actions.concat([tool])
        }
      } else if (tool instanceof GestureTool) {
        let event_types: GestureType[]
        let multi: boolean
        if (isString(tool.event_type)) {
          event_types = [tool.event_type]
          multi = false
        } else {
          event_types = tool.event_type || []
          multi = true
        }

        for (let et of event_types) {
          if (!(et in this.gestures)) {
            logger.warn(`Toolbar: unknown event type '${et}' for tool: ${tool.type} (${tool.id})`)
            continue
          }

          if (multi)
            et = "multi"

          if (!any(this.gestures[et].tools, (t) => t.id == tool.id))
            this.gestures[et].tools = this.gestures[et].tools.concat([tool])

          this.connect(tool.properties.active.change, this._active_change.bind(this, tool))
        }
      }
    }

    if (this.active_inspect == 'auto') {
      // do nothing as all tools are active be default
    } else if (this.active_inspect instanceof InspectTool) {
      for (const inspector of this.inspectors) {
        if (inspector != this.active_inspect)
          inspector.active = false
      }
    } else if (isArray(this.active_inspect)) {
      for (const inspector of this.inspectors) {
        if (!includes(this.active_inspect, inspector))
          inspector.active = false
      }
    } else if (this.active_inspect == null) {
      for (const inspector of this.inspectors)
        inspector.active = false
    }

    const _activate_gesture = (tool: Tool) => {
      if (tool.active) {
        // tool was activated by a proxy, but we need to finish configuration manually
        this._active_change(tool)
      } else
        tool.active = true
    }

    for (const et in this.gestures) {
      const gesture = this.gestures[et as GestureType]

      if (gesture.tools.length == 0)
        continue

      gesture.tools = sortBy(gesture.tools, (tool) => tool.default_order)

      if (et == 'tap') {
        if (this.active_tap == null)
          continue

        if (this.active_tap == 'auto')
          _activate_gesture(gesture.tools[0])
        else
          _activate_gesture(this.active_tap)
      }

      if (et == 'pan') {
        if (this.active_drag == null)
          continue

        if (this.active_drag == 'auto')
          _activate_gesture(gesture.tools[0])
        else
          _activate_gesture(this.active_drag)
      }

      if (et == 'pinch' || et == 'scroll') {
        if (this.active_scroll == null || this.active_scroll == 'auto')
          continue
        _activate_gesture(this.active_scroll)
      }
//.........这里部分代码省略.........