TypeScript dom.div函数代码示例

OGeek|极客世界-中国程序员成长平台 › 门户 › 编程› TypeScript›TypeScript教程

原作者: [db:作者] 来自: [db:来源] 收藏邀请

本文整理汇总了TypeScript中core/dom.div函数的典型用法代码示例。如果您正苦于以下问题：TypeScript div函数的具体用法？TypeScript div怎么用？TypeScript div使用的例子？那么恭喜您, 这里精选的函数代码示例或许可以为您提供帮助。

在下文中一共展示了div函数的10个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于我们的系统推荐出更棒的TypeScript代码示例。

示例1: initialize

  initialize(options: any): void {
    super.initialize(options)

    this.map_el = this.model.map ? this.el.appendChild(div({class: "bk-canvas-map"})) : null

    switch (this.model.output_backend) {
      case "canvas":
      case "webgl": {
        this.canvas_el = this.el.appendChild(canvas({class: "bk-canvas"}))
        const ctx = this.canvas_el.getContext('2d')
        if (ctx == null)
          throw new Error("unable to obtain 2D rendering context")
        this._ctx = ctx
        break
      }
      case "svg": {
        const ctx = new SVGRenderingContext2D()
        this._ctx = ctx
        this.canvas_el = this.el.appendChild(ctx.getSvg())
        break
      }
    }

    this.overlays_el = this.el.appendChild(div({class: "bk-canvas-overlays"}))
    this.events_el   = this.el.appendChild(div({class: "bk-canvas-events"}))

    fixup_ctx(this._ctx)

    logger.debug("CanvasView initialized")
  }

开发者ID:，项目名称:，代码行数:30，代码来源:

示例2: initialize

  initialize(options: any): void {
    super.initialize(options)

    this.map_el = this.model.map ? this.el.appendChild(div({class: "bk-canvas-map"})) : null

    switch (this.model.output_backend) {
      case "canvas":
      case "webgl":
        this.canvas_el = this.el.appendChild(canvas({class: "bk-canvas"}))
        this._ctx = this.canvas_el.getContext('2d')
        break
      case "svg":
        this._ctx = new canvas2svg()
        this.canvas_el = this.el.appendChild(this._ctx.getSvg())
        break
    }

    this.overlays_el = this.el.appendChild(div({class: "bk-canvas-overlays"}))
    this.events_el   = this.el.appendChild(div({class: "bk-canvas-events"}))

    this.ctx = this.get_ctx()
    // work around canvas incompatibilities
    fixup_ctx(this.ctx)

    logger.debug("CanvasView initialized")
  }

开发者ID:gully，项目名称:bokeh，代码行数:26，代码来源:canvas.ts

示例3: render

  render(): void {
    super.render()
    empty(this.el)

    const active = this.model.active
    const labels = this.model.labels

    for (let i = 0; i < labels.length; i++) {
      const text = labels[i]

      const inputEl = input({type: `checkbox`, value: `${i}`})
      inputEl.addEventListener("change", () => this.change_input())

      if (this.model.disabled)
        inputEl.disabled = true

      if (includes(active, i))
        inputEl.checked = true

      const labelEl = label({}, inputEl, text)
      if (this.model.inline) {
        labelEl.classList.add("bk-bs-checkbox-inline")
        this.el.appendChild(labelEl)
      } else {
        const divEl = div({class: "bk-bs-checkbox"}, labelEl)
        this.el.appendChild(divEl)
      }
    }
  }

开发者ID:Zyell，项目名称:bokeh，代码行数:29，代码来源:checkbox_group.ts

示例4: render

  render(): void {
    empty(this.el)
    this.el.classList.add("bk-toolbar")
    this.el.classList.add(`bk-toolbar-${this.model.toolbar_location}`)
    this._toolbar_view_model.autohide = this.model.autohide
    this._on_visible_change()

    if (this.model.logo != null) {
      const cls = this.model.logo === "grey" ? "bk-grey" : null
      const logo = a({href: "https://bokeh.pydata.org/", target: "_blank", class: ["bk-logo", "bk-logo-small", cls]})
      this.el.appendChild(logo)
    }

    const bars: HTMLElement[][] = []

    const el = (tool: Tool) => {
      return this._tool_button_views[tool.id].el
    }

    const {gestures} = this.model
    for (const et in gestures) {
      bars.push(gestures[et as EventType].tools.map(el))
    }

    bars.push(this.model.actions.map(el))
    bars.push(this.model.inspectors.filter((tool) => tool.toggleable).map(el))
    bars.push(this.model.help.map(el))

    for (const bar of bars) {
      if (bar.length !== 0) {
        const el = div({class: 'bk-button-bar'}, bar)
        this.el.appendChild(el)
      }
    }
  }

开发者ID:jsignell，项目名称:bokeh，代码行数:35，代码来源:toolbar_base.ts

示例5: _add_attribution

  protected _add_attribution(): void {
    const {attribution} = this.model.tile_source

    if (isString(attribution) && attribution.length > 0) {
      if (this.attributionEl == null) {
        const right = this.plot_model.canvas._right.value - this.plot_model.frame._right.value
        const bottom = this.plot_model.canvas._bottom.value - this.plot_model.frame._bottom.value
        const max_width = this.map_frame._width.value
        this.attributionEl = div({
          class: 'bk-tile-attribution',
          style: {
            position: "absolute",
            bottom: `${bottom}px`,
            right: `${right}px`,
            'max-width': `${max_width - 4 /*padding*/}px`,
            padding: "2px",
            'background-color': 'rgba(255,255,255,0.5)',
            'font-size': '7pt',
            'font-family': 'sans-serif',
            'line-height': '1.05',
            'white-space': 'nowrap',
            overflow: 'hidden',
            'text-overflow': 'ellipsis',
          },
        })

        const overlays = this.plot_view.canvas_view.events_el
        overlays.appendChild(this.attributionEl)
      }

      this.attributionEl.innerHTML = attribution
      this.attributionEl.title = this.attributionEl.textContent!.replace(/\s*\n\s*/g, " ")
    }
  }

开发者ID:，项目名称:，代码行数:34，代码来源:

示例6: _add_attribution

  protected _add_attribution(): void {
    const { attribution } = this.model.tile_source

    if (isString(attribution) && (attribution.length > 0)) {
      if ((this.attributionEl == null)) {
        const right = this.plot_model.canvas._right.value - this.plot_model.frame._right.value
        const bottom = this.plot_model.canvas._bottom.value - this.plot_model.frame._bottom.value
        const max_width = this.map_frame._width.value
        this.attributionEl = div({
          class: 'bk-tile-attribution',
          style: {
            position: "absolute",
            bottom: `${bottom}px`,
            right: `${right}px`,
            'max-width': `${max_width}px`,
            padding: "2px",
            'background-color': 'rgba(255,255,255,0.8)',
            'font-size': '9pt',
            'font-family': 'sans-serif',
          },
        })

        const overlays = this.plot_view.canvas_view.events_el
        overlays.appendChild(this.attributionEl)
      }

      this.attributionEl.innerHTML = attribution
    }
  }

开发者ID:Zyell，项目名称:bokeh，代码行数:29，代码来源:tile_renderer.ts

示例7: div

 this._buttons = this.model.labels.map((label, i) => {
   const button = div({
     class: [`bk-btn`, `bk-btn-${this.model.button_type}`],
     disabled: this.model.disabled,
   }, label)
   button.addEventListener("click", () => this.change_active(i))
   return button
 })

开发者ID:digitalsatori，项目名称:Bokeh，代码行数:8，代码来源:button_group.ts

示例8: render

 render(): void {
   super.render()
   const content = div()
   if (this.model.render_as_text)
     content.textContent = this.model.text
   else
     content.innerHTML = this.model.text
   this.markupEl.appendChild(content)
 }

开发者ID:Zyell，项目名称:bokeh，代码行数:9，代码来源:div.ts

示例9: render

  render(): void {
    super.render()

    const {title} = this.model
    this.label_el = label({style: {display: title.length == 0 ? "none" : ""}}, title)

    this.group_el = div({class: "bk-input-group"}, this.label_el)
    this.el.appendChild(this.group_el)
  }

开发者ID:digitalsatori，项目名称:Bokeh，代码行数:9，代码来源:input_widget.ts

示例10: render

 render(): void {
   super.render()
   empty(this.el)
   const style = extend({
     width: `${this.model.width}px`,
     height: `${this.model.height}px`,
   }, this.model.style)
   this.markupEl = div({style: style})
   this.el.appendChild(this.markupEl)
 }

开发者ID:FourtekIT-incubator，项目名称:bokeh，代码行数:10，代码来源:markup.ts

注：本文中的core/dom.div函数示例由纯净天空整理自Github/MSDocs等源码及文档管理平台，相关代码片段筛选自各路编程大神贡献的开源项目，源码版权归原作者所有，传播和使用请参考对应项目的License；未经允许，请勿转载。