本文整理汇总了TypeScript中core/dom.show函数的典型用法代码示例。如果您正苦于以下问题:TypeScript show函数的具体用法?TypeScript show怎么用?TypeScript show使用的例子?那么, 这里精选的函数代码示例或许可以为您提供帮助。
在下文中一共展示了show函数的10个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: render
render(): void {
super.render()
if (!this.model.visible) {
hide(this.el)
return
}
const panel = this.model.panel!
this.el.style.position = "absolute"
this.el.style.left = `${panel._left.value}px`
this.el.style.top = `${panel._top.value}px`
this.el.style.width = `${panel._width.value}px`
this.el.style.height = `${panel._height.value}px`
this.el.style.overflow = "hidden"
const toolbar = this._toolbar_views[this.model.toolbar.id]
toolbar.render()
empty(this.el)
this.el.appendChild(toolbar.el)
show(this.el)
}
示例2: update_position
update_position(): void {
super.update_position()
this.header_el.style.position = "absolute" // XXX: do it in position()
position(this.header_el, this.header.bbox)
const loc = this.model.tabs_location
const vertical = loc == "above" || loc == "below"
const scroll_el_size = size(this.scroll_el)
const headers_el_size = scroll_size(this.headers_el)
if (vertical) {
const {width} = this.header.bbox
if (headers_el_size.width > width)
this.wrapper_el.style.maxWidth = `${width - scroll_el_size.width}px`
else
undisplay(this.scroll_el)
} else {
const {height} = this.header.bbox
if (headers_el_size.height > height)
this.wrapper_el.style.maxHeight = `${height - scroll_el_size.height}px`
else
undisplay(this.scroll_el)
}
const {child_views} = this
for (const child_view of child_views)
hide(child_view.el)
show(child_views[this.model.active].el)
}
示例3: render
render() {
super.render();
if (!this.model.visible) {
hide(this.el);
return;
}
const { panel } = this.model;
this.el.style.position = "absolute";
this.el.style.left = `${panel._left.value}px`;
this.el.style.top = `${panel._top.value}px`;
this.el.style.width = `${panel._width.value}px`;
this.el.style.height = `${panel._height.value}px`;
this.el.style.overflow = "hidden";
const toolbar = this._toolbar_views[this.model.toolbar.id];
toolbar.render();
empty(this.el);
this.el.appendChild(toolbar.el);
return show(this.el);
}
示例4: update_position
update_position(): void {
super.update_position()
position(this.header_el, this.header.bbox)
const {child_views} = this
for (const child_view of child_views)
hide(child_view.el)
show(child_views[this.model.active].el)
}
示例5: on_active_change
on_active_change(): void {
const i = this.model.active
const headers = children(this.header_el)
for (const el of headers)
el.classList.remove("bk-active")
headers[i].classList.add("bk-active")
const {child_views} = this
for (const child_view of child_views)
hide(child_view.el)
show(child_views[i].el)
}
示例6: _css_text
_css_text(ctx: Context2d, text, sx, sy, angle) {
let line_dash;
hide(this.el);
this.visuals.text.set_value(ctx);
const bbox_dims = this._calculate_bounding_box_dimensions(ctx, text);
// attempt to support vector string-style ("8 4 8") line dashing for css mode
const ld = this.visuals.border_line.line_dash.value();
if (isArray(ld)) {
if (ld.length < 2) {
line_dash = "solid";
} else {
line_dash = "dashed";
}
}
if (isString(ld)) {
line_dash = ld;
}
this.visuals.border_line.set_value(ctx);
this.visuals.background_fill.set_value(ctx);
this.el.style.position = 'absolute';
this.el.style.left = `${sx + bbox_dims[0]}px`;
this.el.style.top = `${sy + bbox_dims[1]}px`;
this.el.style.color = `${this.visuals.text.text_color.value()}`;
this.el.style.opacity = `${this.visuals.text.text_alpha.value()}`;
this.el.style.font = `${this.visuals.text.font_value()}`;
this.el.style.lineHeight = "normal"; // needed to prevent ipynb css override
if (angle) {
this.el.style.transform = `rotate(${angle}rad)`;
}
if (this.visuals.background_fill.doit) {
this.el.style.backgroundColor = `${this.visuals.background_fill.color_value()}`;
}
if (this.visuals.border_line.doit) {
this.el.style.borderStyle = `${line_dash}`;
this.el.style.borderWidth = `${this.visuals.border_line.line_width.value()}px`;
this.el.style.borderColor = `${this.visuals.border_line.color_value()}`;
}
this.el.textContent = text;
return show(this.el);
}
示例7: _css_box
protected _css_box(sleft: number, sright: number, sbottom: number, stop: number): void {
const sw = Math.abs(sright - sleft)
const sh = Math.abs(sbottom - stop)
this.el.style.left = `${sleft}px`
this.el.style.width = `${sw}px`
this.el.style.top = `${stop}px`
this.el.style.height = `${sh}px`
this.el.style.borderWidth = `${this.model.properties.line_width.value()}px`
this.el.style.borderColor = this.model.properties.line_color.value()
this.el.style.backgroundColor = this.model.properties.fill_color.value()
this.el.style.opacity = this.model.properties.fill_alpha.value()
// try our best to honor line dashing in some way, if we can
const ld = this.model.properties.line_dash.value().length < 2 ? "solid" : "dashed"
this.el.style.borderStyle = ld
show(this.el)
}
示例8: _css_text
protected _css_text(ctx: Context2d, text: string, sx: number, sy: number, angle: number): void {
hide(this.el)
this.visuals.text.set_value(ctx)
const bbox_dims = this._calculate_bounding_box_dimensions(ctx, text)
// attempt to support vector string-style ("8 4 8") line dashing for css mode
const ld = this.visuals.border_line.line_dash.value()
const line_dash = ld.length < 2 ? "solid" : "dashed"
this.visuals.border_line.set_value(ctx)
this.visuals.background_fill.set_value(ctx)
this.el.style.position = 'absolute'
this.el.style.left = `${sx + bbox_dims[0]}px`
this.el.style.top = `${sy + bbox_dims[1]}px`
this.el.style.color = `${this.visuals.text.text_color.value()}`
this.el.style.opacity = `${this.visuals.text.text_alpha.value()}`
this.el.style.font = `${this.visuals.text.font_value()}`
this.el.style.lineHeight = "normal"; // needed to prevent ipynb css override
if (angle) {
this.el.style.transform = `rotate(${angle}rad)`
}
if (this.visuals.background_fill.doit) {
this.el.style.backgroundColor = `${this.visuals.background_fill.color_value()}`
}
if (this.visuals.border_line.doit) {
this.el.style.borderStyle = `${line_dash}`
this.el.style.borderWidth = `${this.visuals.border_line.line_width.value()}px`
this.el.style.borderColor = `${this.visuals.border_line.color_value()}`
}
this.el.textContent = text
show(this.el)
}
示例9: _css_box
_css_box(sleft, sright, sbottom, stop) {
const sw = Math.abs(sright-sleft);
const sh = Math.abs(sbottom-stop);
this.el.style.left = `${sleft}px`;
this.el.style.width = `${sw}px`;
this.el.style.top = `${stop}px`;
this.el.style.height = `${sh}px`;
this.el.style.borderWidth = `${this.model.line_width.value}px`;
this.el.style.borderColor = this.model.line_color.value;
this.el.style.backgroundColor = this.model.fill_color.value;
this.el.style.opacity = this.model.fill_alpha.value;
// try our best to honor line dashing in some way, if we can
let ld = this.model.line_dash;
if (isArray(ld)) {
ld = ld.length < 2 ? "solid" : "dashed";
}
if (isString(ld)) {
this.el.style.borderStyle = ld;
}
return show(this.el);
}
示例10: _draw_tips
protected _draw_tips(): void {
const {data} = this.model
empty(this.el)
hide(this.el)
if (this.model.custom)
this.el.classList.add("bk-tooltip-custom")
else
this.el.classList.remove("bk-tooltip-custom")
if (data.length == 0)
return
const {frame} = this.plot_view
for (const [sx, sy, content] of data) {
if (this.model.inner_only && !frame.bbox.contains(sx, sy))
continue
const tip = div({}, content)
this.el.appendChild(tip)
}
const [sx, sy] = data[data.length - 1] // XXX: this previously depended on {sx, sy} leaking from the for-loop
const side = compute_side(this.model.attachment, sx, sy, frame._hcenter.value, frame._vcenter.value)
this.el.classList.remove("bk-right")
this.el.classList.remove("bk-left")
this.el.classList.remove("bk-above")
this.el.classList.remove("bk-below")
const arrow_size = 10 // XXX: keep in sync with less
show(this.el) // XXX: {offset,client}Width() gives 0 when display="none"
// slightly confusing: side "left" (for example) is relative to point that
// is being annotated but CS class "bk-left" is relative to the tooltip itself
let left: number, top: number
switch (side) {
case "right":
this.el.classList.add("bk-left")
left = sx + (this.el.offsetWidth - this.el.clientWidth) + arrow_size
top = sy - this.el.offsetHeight/2
break
case "left":
this.el.classList.add("bk-right")
left = sx - this.el.offsetWidth - arrow_size
top = sy - this.el.offsetHeight/2
break
case "below":
this.el.classList.add("bk-above")
top = sy + (this.el.offsetHeight - this.el.clientHeight) + arrow_size
left = Math.round(sx - this.el.offsetWidth/2)
break
case "above":
this.el.classList.add("bk-below")
top = sy - this.el.offsetHeight - arrow_size
left = Math.round(sx - this.el.offsetWidth/2)
break
default:
throw new Error("unreachable code")
}
if (this.model.show_arrow)
this.el.classList.add("bk-tooltip-arrow")
// TODO (bev) this is not currently bulletproof. If there are
// two hits, not colocated and one is off the screen, that can
// be problematic
if (this.el.childNodes.length > 0) {
this.el.style.top = `${top}px`
this.el.style.left = `${left}px`
} else
hide(this.el)
}