SVGContainer

Type class

A class used to create an HTML wrapper for the SVG contents.

Sources

SVGContainer can be used (imported) via one of the following packages.

// SVGContainer is available in all of the following modules.
// You only need to import one of them.

/**
 * --------------------------------------------------------
 * Import from: "core.ts"
 * Use like: am4core.SVGContainer
 * --------------------------------------------------------
 */
import * as am4core from "@amcharts/amcharts4/core";

// SVGContainer is available in all of the following modules.
// You only need to import one of them.

/**
 * --------------------------------------------------------
 * Include via: <script src="core.js"></script>
 * Access items like: am4core.SVGContainer
 * --------------------------------------------------------
 */

Inheritance

SVGContainer does not extend any other symbol.

SVGContainer is not extended by any other symbol.

Properties

SVGContainer
#

Type HTMLDivElement

A <div> element which acts as a wrapper/holder for the SVG element.

autoResize
#

Type Boolean

Default true

If this component is in a separate HTML container, autoResize means the module will constantly measure container's size and adopt contents to it.

container
#

Type $type.Optional < Container >

A Container element which is placed into container.

cssScale
#

Type number

Default 1

height
#

Type $type.Optional < number >

Height of HTML element.

hideOverflow
#

Type boolean

Indicates if chart container should have its style set to overflow: hidden.

Normally, we don't want that, so that certain elements, such as tooltips, would be able to go outside chart area.

There is one issue though. Some browsers ignore SVG masks and would display scrollbars if chart elements, that go outside chart area extend outside window.

This is especially true for MapChart, which can have its elements extend very widely when zoomed in. Even if those parts are not visible because of SVG masks, some browsers might still display window scrollbars.

This is why we set this setting to true in MapChart.

Other charts use default of false.

htmlElement
#

Type HTMLElement

A parent HTML container that SVG wrapper element is placed in.

modal
#

Type Modal

Returns a Modal instance, associated with this chart.

(elements top parent)Accessing modal does not make it appear. To make a modal appear, use showModal() method.

@see Modal for more information about using Modal windows

popups
#

Type ListTemplate < Popup >

A list of popups for this chart.

width
#

Type $type.Optional < number >

Width of HTML element.

Methods

constructor(

htmlElement: HTMLElement,
ghost?: boolean

)

#

Returns SVGContainer

Constructor

  • Creates an HTML wrapper for SVG

closeAllPopups()

#

Returns void

Closes all currently open popup windows

closeModal()

#

Returns void

Hides modal window if there is one currently open.

dispose()

#

Returns void

Removes this container from SVG container list in system, which effectively disables size change monitoring for it.

isDisposed()

#

Returns boolean

Returns if this object has been already been disposed.

openModal(

text: string,
title?: string

)

#

Returns Modal

Opens a modal window with specific content (text parameter) and, optionally, title.

The text parameter can contain HTML content.

@see Modal for more information about using Modal windows

openPopup(

text: string,
title?: string

)

#

Returns Popup

Creates, opens, and returns a new Popup window.

text can be any valid HTML.

title is currently not supported.

Events

SVGContainer does not have any events.

Adapters

SVGContainer does not have any adapters.