本文整理匯總了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")
}示例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")
}示例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)
}
}
}示例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)
}
}
}示例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, " ")
}
}示例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
}
}示例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
})示例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)
}示例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)
}示例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)
}