Documentation

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.

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


/**
 * --------------------------------------------------------
 * Include via: <script src="core.js"></script>
 * Access items like: am4.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.

Modal for more information about using Modal windows

popups
#

Type ListTemplate < Popup >

A list of popups for this chart.
readerAlertElement
#

Type HTMLDivElement

A <div> element used as as placeholder to trigger screen alerts.

@sunce 4.9.2

width
#

Type $type.Optional < number >

Width of HTML element.

Methods

closeAllPopups()

#

Returns void

Closes all currently open popup windows

closeModal()

#

Returns void

Hides modal window if there is one currently open.

constructor(

htmlElement: HTMLElement,
ghost?: boolean

)

#

Returns SVGContainer

Constructor

  • Creates an HTML wrapper for SVG

dispose()

#

Returns void

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

initSensor()

#

Returns void

(Re)Initializes a resize sensor.

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.

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.

readerAlert(

text: string

)

#

Returns void

Triggers screen reader read out a message.

@since 4.9.2

Events

SVGContainer does not have any events.

Adapters

SVGContainer does not have any adapters.