Class

# WebChart

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

## Description

Displays data you provide in chart form of various types.

## Properties

<div class="rst-class">

table-centered_columns_3_and_4

</div>

| Name                                                      | Type                                               | Read-Only | Shared |
|-----------------------------------------------------------|----------------------------------------------------|-----------|--------|
| `AllowPopover<webchart.allowpopover>`                     | `Boolean</api/data_types/boolean>`                 |           |        |
| `AutoCalculateYAxis<webchart.autocalculateyaxis>`         | `Boolean</api/data_types/boolean>`                 |           |        |
| `Backdrop<webchart.backdrop>`                             | `WebPicture</api/graphics/webpicture>`             |           |        |
| `ContextualMenu<webchart.contextualmenu>`                 | `WebMenuItem</api/user_interface/web/webmenuitem>` |           |        |
| `ControlID<webchart.controlid>`                           | `String</api/data_types/string>`                   | ✓         |        |
| `DatasetCount<webchart.datasetcount>`                     | `Integer</api/data_types/integer>`                 | ✓         |        |
| `DatasetLastIndex<webchart.datasetlastindex>`             | `Integer</api/data_types/integer>`                 | ✓         |        |
| `Enabled<webchart.enabled>`                               | `Boolean</api/data_types/boolean>`                 |           |        |
| `GridColor<webchart.gridcolor>`                           | `ColorGroup</api/graphics/colorgroup>`             |           |        |
| `HasAnimation<webchart.hasanimation>`                     | `Boolean</api/data_types/boolean>`                 |           |        |
| `HasLegend<webchart.haslegend>`                           | `Boolean</api/data_types/boolean>`                 |           |        |
| `Height<webchart.height>`                                 | `Integer</api/data_types/integer>`                 |           |        |
| `Indicator<webchart.indicator>`                           | `Indicators<webuicontrol.indicators>`              |           |        |
| `IsGridVisible<webchart.isgridvisible>`                   | `Boolean</api/data_types/boolean>`                 |           |        |
| `IsYAxisVisible<webchart.isyaxisvisible>`                 | `Boolean</api/data_types/boolean>`                 |           |        |
| `IsXAxisVisible<webchart.isxaxisvisible>`                 | `Boolean</api/data_types/boolean>`                 |           |        |
| `LabelCount<webchart.LabelCount>`                         | `Integer</api/data_types/integer>`                 | ✓         |        |
| `LabelLastIndex<webchart.labellastindex>`                 | `Integer</api/data_types/integer>`                 | ✓         |        |
| `Left<webchart.left>`                                     | `Integer</api/data_types/integer>`                 |           |        |
| `LegendColor<webchart.gridcolor>`                         | `ColorGroup</api/graphics/colorgroup>`             |           |        |
| `LegendFontName<webchart.legendfontname>`                 | `String</api/data_types/string>`                   |           |        |
| `LegendFontSize<webchart.legendfontsize>`                 | `Double</api/data_types/double>`                   |           |        |
| `LockBottom<webchart.lockbottom>`                         | `Boolean</api/data_types/boolean>`                 |           |        |
| `LockHorizontal<webchart.lockhorizontal>`                 | `Boolean</api/data_types/boolean>`                 |           |        |
| `LockLeft<webchart.lockleft>`                             | `Boolean</api/data_types/boolean>`                 |           |        |
| `LockRight<webchart.lockright>`                           | `Boolean</api/data_types/boolean>`                 |           |        |
| `LockTop<webchart.locktop>`                               | `Boolean</api/data_types/boolean>`                 |           |        |
| `LockVertical<webchart.lockvertical>`                     | `Boolean</api/data_types/boolean>`                 |           |        |
| `Mode<webchart.mode>`                                     | `Modes<webchart.modes>`                            |           |        |
| `Name<webchart.name>`                                     | `String</api/data_types/string>`                   | ✓         |        |
| `Page<webchart.page>`                                     | `WebPage</api/user_interface/web/webpage>`         | ✓         |        |
| `PanelIndex<webchart.panelindex>`                         | `Integer</api/data_types/integer>`                 |           |        |
| `Parent<webchart.parent>`                                 | `WebView</api/user_interface/web/webview>`         | ✓         |        |
| `PopoverBackgroundColor<webchart.Popoverbackgroundcolor>` | `ColorGroup</api/graphics/colorgroup>`             |           |        |
| `TabIndex<webchart.tabindex>`                             | `Integer</api/data_types/integer>`                 |           |        |
| `Title<webchart.title>`                                   | `String</api/data_types/string>`                   |           |        |
| `TitleColor<webchart.titlecolor>`                         | `ColorGroup</api/graphics/colorgroup>`             |           |        |
| `TitleFontName<webchart.titlefontname>`                   | `String</api/data_types/string>`                   |           |        |
| `TitleFontSize<webchart.titlefontsize>`                   | `Double</api/data_types/double>`                   |           |        |
| `Tooltip<webchart.tooltip>`                               | `WebToolTip</api/user_interface/web/webtooltip>`   |           |        |
| `Top<webchart.top>`                                       | `Integer</api/data_types/integer>`                 |           |        |
| `Visible<webchart.visible>`                               | `Boolean</api/data_types/boolean>`                 |           |        |
| `Width<webchart.width>`                                   | `Integer</api/data_types/integer>`                 |           |        |

## Methods

<div class="rst-class">

table-centered_column_4

</div>

| Name                                            | Parameters                                                                                                                                    | Returns                                                 | Shared |
|-------------------------------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------|---------------------------------------------------------|--------|
| `AcceptPictureDrop<webchart.acceptpicturedrop>` | dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>` |                                                         |        |
| `AcceptRawDataDrop<webchart.acceptrawdatadrop>` | dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>` |                                                         |        |
| `AcceptTextDrop<webchart.accepttextdrop>`       | dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>` |                                                         |        |
| `AddDataset<webchart.adddataset>`               | dataset As `ChartDataset</api/user_interface/charts/chartdataset>`                                                                            |                                                         |        |
| `AddDatasetAt<webchart.adddatasetat>`           | index As `Integer</api/data_types/integer>`, Dataset As `ChartDataset</api/user_interface/charts/chartdataset>`                               |                                                         |        |
| `AddDatasets<webchart.adddatasets>`             | datasets() As `ChartDataset</api/user_interface/charts/chartdataset>`                                                                         |                                                         |        |
| `AddLabel<webchart.addlabel>`                   | name As `String</api/data_types/string>`                                                                                                      |                                                         |        |
| `AddLabelAt<webchart.addlabelat>`               | index As `String</api/data_types/string>`, name As `String</api/data_types/string>`                                                           |                                                         |        |
| `AddLabels<webchart.addlabels>`                 | names() As `String</api/data_types/string>`                                                                                                   |                                                         |        |
| `AllowPictureDrag<webchart.allowpicturedrag>`   | dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>` |                                                         |        |
| `AllowRawDataDrag<webchart.allowrawdatadrag>`   | dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>` |                                                         |        |
| `AllowTextDrag<webchart.allowtextdrag>`         | dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>` |                                                         |        |
| `Close<webchart.close>`                         |                                                                                                                                               |                                                         |        |
| `CSSClasses<webchart.cssclasses>`               |                                                                                                                                               | `WebCSSClasses</api/web/webcssclasses>`                 |        |
| `DatasetAt<webchart.datasetat>`                 | index As `Integer</api/data_types/integer>`                                                                                                   | `ChartDataset</api/user_interface/charts/chartdataset>` |        |
| `Datasets<webchart.datasets>`                   |                                                                                                                                               | `Iterable</api/language/iterable>`                      |        |
| `ExecuteJavaScript<webchart.executejavascript>` | script As `String</api/data_types/string>`                                                                                                    |                                                         |        |
| `GotoURL<webchart.gotourl>`                     | url As `String</api/data_types/string>`, inNewWindow As `Boolean</api/data_types/boolean>` = `False</api/language/false>`                     |                                                         |        |
| `LabelAt<webchart.labelat>`                     | index As `Integer</api/data_types/integer>`                                                                                                   | `String</api/data_types/string>`                        |        |
| `Labels<webchart.labels>`                       |                                                                                                                                               | `Iterable</api/language/iterable>`                      |        |
| `RemoveAllDatasets<webchart.removealldatasets>` |                                                                                                                                               |                                                         |        |
| `RemoveAllLabels<webchart.removealllabels>`     |                                                                                                                                               |                                                         |        |
| `RemoveDatasetAt<webchart.removedatasetat>`     | index As `Integer</api/data_types/integer>`                                                                                                   |                                                         |        |
| `RemoveLabelAt<webchart.removelabelat>`         | index As `Integer</api/data_types/integer>`                                                                                                   |                                                         |        |
| `SetFocus<webchart.setfocus>`                   |                                                                                                                                               |                                                         |        |
| `Style<webchart.style>`                         |                                                                                                                                               | `WebStyle</api/user_interface/web/webstyle>`            |        |
|                                                 | `Assigns</api/language/assigns>` style As `WebStyle</api/user_interface/web/webstyle>`                                                        |                                                         |        |
| `ToPicture<webchart.topicture>`                 | width As `Double</api/data_types/double>` = -1, height As `Double</api/data_types/double>` = -1                                               |                                                         |        |
| `UpdateBrowser<webchart.updatebrowser>`         |                                                                                                                                               |                                                         |        |

## Events

<div class="rst-class">

table-centered_column_4

</div>

| Name                                                      | Parameters                                                                                                                                                                                                        | Returns |
|-----------------------------------------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------|
| `Closed<webchart.closed>`                                 |                                                                                                                                                                                                                   |         |
| `ContextualMenuSelected<webchart.contextualmenuselected>` | hitItem As `WebMenuItem</api/user_interface/web/webmenuitem>`                                                                                                                                                     |         |
| `DropObject<webchart.dropobject>`                         | obj As `WebDragItem</api/user_interface/web/webdragitem>`, action As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>`, x As `Integer</api/data_types/integer>`, y As `Integer</api/data_types/integer>` |         |
| `Hidden<webchart.hidden>`                                 |                                                                                                                                                                                                                   |         |
| `Opening<webchart.opening>`                               |                                                                                                                                                                                                                   |         |
| `OverrideOptions<webchart.overrideoptions>`               | options As `JSONItem</api/text/json/jsonitem>`                                                                                                                                                                    |         |
| `Pressed<webchart.pressed>`                               | dataset As `ChartData</api/user_interface/charts/chartdata>`, index As `Integer</api/data_types/integer>`                                                                                                         |         |
| `RequestedPicture<webchart.requestedpicture>`             | chart As `Picture</api/graphics/picture>`                                                                                                                                                                         |         |
| `Shown<webchart.shown>`                                   |                                                                                                                                                                                                                   |         |

## Enumerations

<div id="webchart.modes">

<div class="rst-class">

forsearch

</div>

</div>

WebChart.Modes

### Modes

> The various types of charts available.
>
> | Enum      |
> |-----------|
> | Bar       |
> | Bubble    |
> | Doughnut  |
> | Line      |
> | Pie       |
> | PolarArea |
> | Radar     |
> | Scatter   |
> | Stacked   |

## Property descriptions

<div id="webchart.allowpopover">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AllowPopover

**AllowPopover** As `Boolean</api/data_types/boolean>`

> If `True</api/language/true>`, a popover will be displayed when the user positions the mouse over items that have additional information.
>
> The default value is `True</api/language/true>`.

<div id="Webchart.autocalculateyaxis">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AutoCalculateYAxis

**AutoCalculateYAxis** As `Boolean</api/data_types/boolean>`

> If `False</api/language/false>`, the Y axis for Line and Bar charts will start at 0.
>
> This property is `True</api/language/true>` by default.

<div id="webchart.backdrop">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Backdrop

**Backdrop** As `WebPicture</api/graphics/webpicture>`

> The passed `WebPicture</api/graphics/webpicture>` that will automatically be drawn behind the chart data.
>
> The following code assigns a jpg image to the Backdrop. The image has been added to the project. The code is in the Opening event.
>
> ``` xojo
> Me.BackDrop = HouseImage
> ```

<div id="webchart.contextualmenu">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.ContextualMenu

**ContextualMenu** As `WebMenuItem</api/user_interface/web/webmenuitem>`

> If you assign a `WebMenuItem</api/user_interface/web/webmenuitem>` to the control, it will be displayed when the user right-clicks the control.
>
> On a `WebPage</api/user_interface/web/webpage>`, you can disable/remove the default contextual menu by an empty `WebMenuItem</api/user_interface/web/webmenuitem>` class object to this property.
>
> This code populates a contextual menu in the Shown event of the control.
>
> ``` xojo
> Var menu As New WebMenuItem
>
> menu.AddMenuItem("One")
> menu.AddMenuItem("Two")
> menu.AddMenuItem("Three")
> Me.ContextualMenu = menu
> ```
>
> The menu selection is then handled by the ContextualMenuSelected event when the user right-clicks on the control. For example, it can be of the form:
>
> ``` xojo
> Select Case hitItem.Text
> Case "One"
>   MessageBox("One")
> Case "Two"
>   MessageBox("Two")
> Case "Three"
>   MessageBox("Three")
> End Select
> ```

<div id="webchart.controlid">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.ControlID

**ControlID** As `String</api/data_types/string>`

> Identifies the control on a per session basis.
>
> This property is read-only.

<div id="webchart.datasetcount">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.DatasetCount

**DatasetCount** As `Integer</api/data_types/integer>`

> The number of datasets that have been added to the chart.
>
> This property is read-only.

<div id="webchart.datasetlastindex">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.DatasetLastIndex

**DatasetLastIndex** As `Integer</api/data_types/integer>`

> The index of last dataset added to the chart.
>
> This property is read-only.

<div id="webchart.enabled">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Enabled

**Enabled** As `Boolean</api/data_types/boolean>`

> When `True</api/language/true>` the **WebControl** is drawn enabled and responds to user action. When `False</api/language/false>`, the control appears as disabled and does not respond to user actions.
>
> In the case of `WebTimer</api/web/webtimer>`, when set to `False</api/language/false>` this disables and stops the WebTimer. When set to `True</api/language/true>`, it starts the WebTimer.
>
> Disable a button when a check box value changes:
>
> ``` xojo
> If AllowSaveCheckBox.Value Then
>   SaveButton.Enabled = True
> Else
>   AllowSaveButton.Enabled = False
> End If
> ```

<div id="webchart.gridcolor">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.GridColor

**GridColor** As `ColorGroup</api/graphics/colorgroup>`

> The color of the chart's grid.

<div id="webchart.hasanimation">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.HasAnimation

**HasAnimation** As `Boolean</api/data_types/boolean>`

> If `True</api/language/true>`, changes to chart data will result in animated updates to the chart.

<div id="webchart.haslegend">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.HasLegend

**HasLegend** As `Boolean</api/data_types/boolean>`

> If `True</api/language/true>`, the chart's legend will be displayed.

<div id="webchart.height">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Height

**Height** As `Integer</api/data_types/integer>`

> The height (in pixels) of the control.

<div id="webchart.indicator">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Indicator

**Indicator** As `Indicators<webuicontrol.indicators>`

> The color scheme for the control.

<div id="webchart.isgridvisible">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.IsGridVisible

**IsGridVisible** As `Boolean</api/data_types/boolean>`

> Determines if the grid will be drawn or not.

<div id="webchart.isyaxisvisible">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.IsYAxisVisible

**IsYAxisVisible** As `Boolean</api/data_types/boolean>`

> Determines if the Y axis will be drawn or not.

<div id="webchart.isxaxisvisible">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.IsXAxisVisible

**IsXAxisVisible** As `Boolean</api/data_types/boolean>`

> Determines if the X axis will be drawn or not.

<div id="webchart.labelcount">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LabelCount

**LabelCount** As `Integer</api/data_types/integer>`

> The number of labels in the chart.
>
> This property is read-only.

<div id="webchart.labellastindex">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LabelLastIndex

**LabelLastIndex** As `Integer</api/data_types/integer>`

> The index of last label added to the chart.
>
> This property is read-only.

<div id="webchart.left">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Left

**Left** As `Integer</api/data_types/integer>`

> The position of the left side of the **WebUIControl** in pixels, relative to the web page.

<div id="webchart.legendcolor">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LegendColor

**TextColor** As `ColorGroup</api/graphics/colorgroup>`

> Gets or sets the color of the legend. The default value is black.
>
> The following example sets the LegendColor.
>
> ``` xojo
> Me.LegendColor = Color.Red
> ```

<div id="webchart.legendfontname">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LegendFontName

**TitleFontName** As `String</api/data_types/string>`

> Name of the font used to display the chart legend.
>
> You can enter any font that is installed in the browser.
>
> <div class="tip">
>
> <div class="title">
>
> Tip
>
> </div>
>
> You can `install fonts from Google</topics/user_interface/web/using_google_fonts>` as well.
>
> </div>
>
> This code sets the FontName property.
>
> ``` xojo
> Me.LegendFontName = "Helvetica"
> ```

<div id="webchart.legendfontsize">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LegendFontSize

**LegendFontSize** As `Double</api/data_types/double>`

> Point size of the font used to display the legend.
>
> If you enter zero as the FontSize, your app will use the font size that works best for the platform on which it is running.
>
> This code sets the font size to 16 points.
>
> ``` xojo
> Me.LegendFontSize = 16
> ```

<div id="webchart.lockbottom">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LockBottom

**LockBottom** As `Boolean</api/data_types/boolean>`

> Determines whether the bottom edge of the control should stay at a set distance from the bottom edge of the parent control, if there is one, or the owning web page.

<div id="webchart.lockhorizontal">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LockHorizontal

**LockHorizontal** As `Boolean</api/data_types/boolean>`

> LockHorizontal overrides LockLeft and LockRight. It allows you to proportionally lock a control's position to the center of its parent control (or web page).
>
> For example, if you place a control in the center of the page and sets both LockHorizontal and LockVertical, the control will stay in the center of the page.

<div id="webchart.lockleft">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LockLeft

**LockLeft** As `Boolean</api/data_types/boolean>`

> Determines whether the left edge of the control should stay at a set distance from the left edge of the parent control, if there is one, or the owning web page.

<div id="webchart.lockright">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LockRight

**LockRight** As `Boolean</api/data_types/boolean>`

> Determines whether the right edge of the control should stay at a set distance from the right edge of the parent control, if there is one, or the owning web page.

<div id="webchart.locktop">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LockTop

**LockTop** As `Boolean</api/data_types/boolean>`

> Determines whether the top edge of the control should stay at a set distance from the top edge of the parent control, if there is one, or the owning web page.

<div id="webchart.lockvertical">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LockVertical

**LockVertical** As `Boolean</api/data_types/boolean>`

> LockVertical overrides LockTop and LockBottom. It allows you to proportionally lock a control's position to keep it centered within the parent control or web page.
>
> For example, if you place a control in the center of the page, and sets both LockHorizontal and LockVertical, the control will stay in the center of the page.

<div id="webchart.mode">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Mode

**Mode** As `Modes<webchart.modes>`

> Indicates the type of chart the control is currently displaying.
>
> Labels are required for a Bar chart to draw.
>
> This example checks the mode of the chart:
>
> ``` xojo
> If Chart1.Mode = WebChart.Modes.Bar then
>   Chart1.Title = "Sales Bar Chart"
> End If
> ```

<div id="webchart.name">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Name

**Name** As `String</api/data_types/string>`

> The name of the control.
>
> This property is read-only.

<div id="webchart.page">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Page

**Page** As `WebPage</api/user_interface/web/webpage>`

> Identifies the web page that contains the control.
>
> This property is read-only.

<div id="webchart.panelindex">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.PanelIndex

**PanelIndex** As `Integer</api/data_types/integer>`

> If the control has been placed on a <span class="title-ref">WebTabPanel</span> or `WebPagePanel</api/user_interface/web/webpagepanel>` control, this is the panel (page/tab) that the control is on. If the control is not on a panel, it returns -1.
>
> The first panel is numbered zero. If the control has been placed on a panel of a <span class="title-ref">WebTabPanel</span> or `WebPagePanel</api/user_interface/web/webpagepanel>` control, it returns the panel number. If the control is not on a `WebPagePanel</api/user_interface/web/webpagepanel>` or <span class="title-ref">WebTabPanel</span>, it returns -1. If you change the PanelIndex to a nonexistent panel, the control will disappear until you give it a PanelIndex value that corresponds to a panel that exists.
>
> If you are looking to change the currently selected panel (page/tab), use `SelectedPanelIndex<webpagecontrol.selectedpanelindex>`.
>
> This code displays the panel index of the control that is on the page.
>
> ``` xojo
> MessageBox(Me.SelectedPanelIndex.ToString)
> ```

<div id="webchart.parent">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Parent

**Parent** As `WebView</api/user_interface/web/webview>`

> Used to get the control's parent control or page. If the parent control is a `WebContainer</api/user_interface/web/webcontainer>`, then it returns the `WebContainer</api/user_interface/web/webcontainer>`. If it is on a `WebPage</api/user_interface/web/webpage>`, it returns the `WebPage</api/user_interface/web/webpage>`.
>
> This property is read-only.

<div id="webchart.Popoverbackgroundcolor">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.PopoverBackgroundColor

**PopoverBackgroundColor** As `ColorGroup</api/graphics/colorgroup>`

> The background color of the chart's popover.

<div id="webchart.tabindex">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.TabIndex

**TabIndex** As `Integer</api/data_types/integer>`

> The **WebChart's** control's position in the Tab Order. The control with a TabIndex of 0 is the first **WebUIControl** to get the focus when the page opens in the browser.
>
> This example sets the control's TabIndex.
>
> ``` xojo
> Me.TabIndex = 2
> ```

<div id="webchart.title">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Title

**Title** As `String</api/data_types/string>`

> The title of the chart.

<div id="webchart.titlecolor">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.TitleColor

**TitleColor** As `ColorGroup</api/graphics/colorgroup>`

> Gets or sets the color of the title. The default value is black.
>
> The following example sets the <span class="title-ref">TitleColor</span>.
>
> ``` xojo
> Me.TitleColor = Color.Red
> ```

<div id="webchart.titlefontname">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.TitleFontName

**TitleFontName** As `String</api/data_types/string>`

> Name of the font used to display the chart title.
>
> You can enter any font that is installed in the browser.
>
> <div class="tip">
>
> <div class="title">
>
> Tip
>
> </div>
>
> You can `install fonts from Google</topics/user_interface/web/using_google_fonts>` as well.
>
> </div>
>
> This code sets the TitleFontName property.
>
> ``` xojo
> Me.TitleFontName = "Helvetica"
> ```

<div id="webchart.titlefontsize">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.TitleFontSize

**TitleFontSize** As `Double</api/data_types/double>`

> Point size of the font used to display the title.
>
> If you enter zero as the FontSize, your app will use the font size that works best for the platform on which it is running.
>
> This code sets the font size to 16 points.
>
> ``` xojo
> Me.TitleFontSize = 16
> ```

<div id="webchart.tooltip">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Tooltip

**Tooltip** As `WebToolTip</api/user_interface/web/webtooltip>`

> Text of a message displayed as a tooltip.
>
> The tip is displayed when the user places the mouse on the control and leaves it there.
>
> This code in the Shown event of a Button sets the tooltip:
>
> ``` xojo
> Me.Tooltip = "Save changes"
> ```

<div id="webchart.top">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Top

**Top** As `Integer</api/data_types/integer>`

> The top of the control in local coordinates relative to the web page.

<div id="webchart.visible">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Visible

**Visible** As `Boolean</api/data_types/boolean>`

> If `True</api/language/true>`, the control is drawn. If `False</api/language/false>`, it's not.
>
> Hide a control based on a checkbox setting:
>
> ``` xojo
> If ShowEmailCheckbox.Value Then
>   EmailField.Visible = True
> Else
>   EmailField.Visible = False
> End If
> ```

<div id="webchart.width">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Width

**Width** As `Integer</api/data_types/integer>`

> The width (in pixels) of the web control.
>
> This code in the Shown event handler increases the size of the control:
>
> ``` xojo
> Me.Width = Me.Width + 50
> ```

## Method descriptions

<div id="webchart.acceptpicturedrop">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AcceptPictureDrop

**AcceptPictureDrop**(dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>`)

> Allows the control to accept a picture drop of a `WebDragItem</api/user_interface/web/webdragitem>`.

<div id="webchart.acceptrawdatadrop">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AcceptRawDataDrop

**AcceptRawDataDrop**(dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>`)

> Allows the control to accept a raw data drop of a `WebDragItem</api/user_interface/web/webdragitem>`.

<div id="webchart.accepttextdrop">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AcceptTextDrop

**AcceptTextDrop**(dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>`)

> Allows the control to accept a picture drop of a `WebDragItem</api/user_interface/web/webdragitem>`.

<div id="webchart.adddataset">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AddDataset

**AddDataset**(dataset As `ChartDataset</api/user_interface/charts/chartdataset>`)

> Adds the dataset to the chart. Incompatible datasets are ignored.

<div id="webchart.adddatasetat">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AddDatasetAt

**AddDatasetAt**(index As `Integer</api/data_types/integer>`, dataset As `ChartDataset</api/user_interface/charts/chartdataset>`)

> Adds the dataset to the chart at the index passed. Incompatible datasets are ignored.

<div id="webchart.adddatasets">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AddDatasets

**AddDatasets**(datasets() As `ChartDataset</api/user_interface/charts/chartdataset>`)

> Adds the array of datasets to the chart.

<div id="webchart.addlabel">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AddLabel

**AddLabel**(name As `String</api/data_types/string>`)

> Adds the label to the chart.

<div id="webchart.addlabelat">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AddLabelAt

**AddLabelAt**(index As `String</api/data_types/string>`, name As `String</api/data_types/string>`)

> Adds the label to the chart at the index passed.

<div id="webchart.addlabels">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AddLabels

**AddLabels**(names() As `String</api/data_types/string>`)

> Adds the array of labels to the chart.

<div id="webchart.allowpicturedrag">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AllowPictureDrag

**AllowPictureDrag**(dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>`)

> Allows the control to be dragged as a picture.

<div id="webchart.allowrawdatadrag">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AllowRawDataDrag

**AllowRawDataDrag**(dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>`)

> Allows the control to be dragged as raw data.

<div id="webchart.allowtextdrag">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.AllowTextDrag

**AllowTextDrag**(dragActionType As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>` = `WebDragItem.DragActionTypes.All<webdragitem.dragactiontypes>`)

> Allows the control to be dragged as text.

<div id="webchart.close">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Close

**Close**

> Closes the chart.

<div id="webchart.cssclasses">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.CSSClasses

**CSSClasses**

> Returns the instance of `WebCSSClasses</api/web/webcssclasses>` for this control allowing you to add CSS classes to and remove CSS classes from the control.

<div id="webchart.datasetat">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.DatasetAt

**DatasetAt**(index As `Integer</api/data_types/integer>`) As `ChartDataset</api/user_interface/charts/chartdataset>`

> Returns the `ChartDataset</api/user_interface/charts/chartdataset>` at the index passed.

<div id="webchart.datasets">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Datasets

**Datasets**() As `Iterable</api/language/iterable>`

> Allows iterating through all data sets.

<div id="webchart.executejavascript">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.ExecuteJavaScript

**ExecuteJavaScript**(script As `String</api/data_types/string>`)

> Executes the JavaScript passed. The JavaScript passed can call a JavaScript function in a WebPageSource control.
>
> The Xojo web framework uses EcmaScript 6 which is more strict than previous versions of JavaScript. For more details, see the [EcmaScript 6 documentation](https://www.ecma-international.org/ecma-262/6.0/).
>
> This code in the Pressed event of a Button displays an alert using JavaScript:
>
> ``` xojo
> Me.ExecuteJavaScript("alert('Hello!');")
> ```
>
> This code will select the text in a WebTextField (or WebTextArea):
>
> ``` xojo
> WebTextField1.ExecuteJavascript("document.getElementById('" + _
>   WebTextField1.ControlID + "_inner').select();")
> ```

<div id="webchart.gotourl">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.GotoURL

**GotoURL**(url As `String</api/data_types/string>`, inNewWindow As `Boolean</api/data_types/boolean>` = `False</api/language/false>`)

> Opens the passed *url* in place of the current web page or downloads a file. If *inNewWindow* is `True</api/language/true>`, the browser is asked to open the *url* in a new window.
>
> If the browser has popup windows disabled and *inNewWindow* is `True</api/language/true>`, the method silently fails and the page is not shown.
>
> If *inNewWindow* is `False</api/language/false>`, the running web app is replaced with the specified *url*. If you want to display an external web site within your web app, use the `WebHTMLViewer</api/user_interface/web/webhtmlviewer>` control.
>
> Display a web site in a new popup window:
>
> ``` xojo
> Me.GotoURL("http://www.wikipedia.org", True)
> ```

<div id="webchart.labelat">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.LabelAt

**LabelAt**(index As `Integer</api/data_types/integer>`) As `String</api/data_types/string>`

> Returns the label at the index passed.

<div id="webchart.labels">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Labels

**Labels**() As `Iterable</api/language/iterable>`

> Allows iterating through all labels.

<div id="webchart.removealldatasets">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.RemoveAllDatasets

**RemoveAllDatasets**

> Removes all datasets from the chart.

<div id="webchart.removealllabels">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.RemoveAllLabels

**RemoveAllLabels**

> Removes all labels from the chart.

<div id="webchart.removedatasetat">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.RemoveDatasetAt

**RemoveDatasetAt**(index As `Integer</api/data_types/integer>`)

> Removes the `ChartDataset</api/user_interface/charts/chartdataset>` at the index passed.

<div id="webchart.removelabelat">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.RemoveLabelAt

**RemoveLabelAt**(index As `Integer</api/data_types/integer>`)

> Removes the label at the index passed.

<div id="webchart.setfocus">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.SetFocus

**SetFocus**

> Sets the focus to the `Control</api/user_interface/web/webuicontrol>`.
>
> This code checks for a required value when a button is pressed:
>
> ``` xojo
> If UserNameField.Text.IsEmpty Then
>   MessageBox("Please enter your UserName.")
>   UserNameField.SetFocus
>   Return
> End If
> ```

<div id="webchart.style">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Style

**Style** As `WebStyle</api/user_interface/web/webstyle>`

> Returns the `WebStyle</api/user_interface/web/webstyle>` for the control.

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

**Style**(`Assigns</api/language/assigns>` style As `WebStyle</api/user_interface/web/webstyle>`)

> Assigns the *style* to the control.
>
> In this example, in any event of the control, set the text to bold:
>
> ``` xojo
> Var style As New WebStyle
> style.Bold = True
> Me.Style = style
> ```

<div id="webchart.topicture">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.ToPicture

**ToPicture**(width As `Double</api/data_types/double>` = -1, height As `Double</api/data_types/double>` = -1)

> Creates a `Picture</api/graphics/picture>` from the the chart at the size specified by the *width* and *height* parameters. If these parameters are not specified, the `Picture</api/graphics/picture>` is created using the dimensions of the chart. The `Picture</api/graphics/picture>` is returned via the `RequestedPicture<webchart.requestedpicture>` event.

<div id="webchart.updatebrowser">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.UpdateBrowser

**UpdateBrowser**

> Forces the current values of the control to be sent to the browser.
>
> This method is useful when you are computing values in a loop and wish to update the browser immediately rather than wait until the current method ends.
>
> This code iterates through a `RowSet</api/databases/rowset>` of `database rows</api/databases/databaserow>`, updates a `ProgressBar</api/user_interface/web/webprogressbar>` and then forces the updated `ProgressBar</api/user_interface/web/webprogressbar>` to be sent to the browser via UpdateBrowser.
>
> ``` xojo
> ProgressBar1.MaximumValue = SalesData.RowCount
> For Each row As DatabaseRow in SalesData
>   AnalyzeSales(row)
>   ProgressBar1.Value = ProgressBar1.Value + 1
>   ProgressBar1.UpdateBrowser
> Next
> ```

## Event descriptions

<div id="webchart.closed">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Closed

**Closed**

> The control has been removed from the browser either because the page has closed or the control's Close method was called.

<div id="webchart.contextualmenuselected">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.ContextualMenuSelected

**ContextualMenuSelected**(hitItem As `WebMenuItem</api/user_interface/web/webmenuitem>`)

> Called when a contextual menu item is selected. This selected item is contained in *hitItem*.
>
> This code populates a contextual menu in the Opening event of a `WebToolbar</api/user_interface/web/webtoolbar>`:
>
> ``` xojo
> Var menu As New WebMenuItem
>
> menu.AddMenuItem("One")
> menu.AddMenuItem("Two")
> menu.AddMenuItem("Three")
> Me.ContextualMenu = menu
> ```
>
> The menu selection is then handled by the ContextualMenuSelected event when the user right-clicks on the control. For example, it can be of the form:
>
> ``` xojo
> Select Case hitItem.Text
> Case "One"
>   MessageBox("One")
> Case "Two"
>   MessageBox("Two")
> Case "Three"
>   MessageBox("Three")
> End Select
> ```

<div id="webchart.dropobject">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.DropObject

**DropObject**(obj As `WebDragItem</api/user_interface/web/webdragitem>`, action As `WebDragItem.DragActionTypes<webdragitem.dragactiontypes>`, x As `Integer</api/data_types/integer>`, y As `Integer</api/data_types/integer>`)

> Called when a dragged item is over a control that can accept it. The dragged item is contained in *obj* and the type of drag is identified by *action*.

<div id="webchart.hidden">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Hidden

**Hidden**

> The control is about to become no longer visible. This could be because the page is being closed, is being replaced as the foreground page by another page or because the control or a parent control's Visible property has been set to `False</api/language/false>`.

<div class="note">

<div class="title">

Note

</div>

This event is equivalent to the `DesktopWindow.Deactivated<desktopwindow.deactivated>` event in a desktop app.

</div>

<div id="webchart.opening">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Opening

**Opening**

> The control has been created and the page is opening but has not been sent to the browser yet.
>
> The Opening event handler can be used to initialize non-visual properties and settings for controls.
>
> In most cases, you should use the `Shown<webuicontrol.shown>` event to initialize controls.

<div id="webchart.overrideoptions">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.OverrideOptions

**OverrideOptions**(options As `JSONItem</api/text/json/jsonitem>`)

> Allows you to override the built-in features of <span class="title-ref">WebChart</span> by modifying the Options parameter passed.
>
> <span class="title-ref">WebChart</span> is based upon [ChartJS](https://www.chartjs.org). See the [ChartJS](https://www.chartjs.org) website for details on the format of the data in the Options parameter.

<div id="webchart.pressed">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Pressed

**Pressed**(dataset As `ChartData</api/user_interface/charts/chartdata>`, index As `Integer</api/data_types/integer>`)

> The user pressed on a part of the chart that represents data from the *dataset*.

<div id="webchart.requestedpicture">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.RequestedPicture

**RequestedPicture**(chart As `Picture</api/graphics/picture>`)

> This event is called when the `ToPicture<webchart.topicture>` method and is passed a `Picture</api/graphics/picture>` representing the chart.

<div id="webchart.shown">

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

</div>

<div class="rst-class">

forsearch

</div>

WebChart.Shown

**Shown**

> The control has appeared on the currently displayed page. This could be because its parent page just finished loading, its parent page has come to the foreground or the control is now visible having been previously invisible because it or its parent control's Visible property has been set to `True</api/language/true>`.
>
> Use the Shown event for initializing your controls or doing anything that would interact with other controls or user interface elements on the web page instead of the `Opening<webcontrol.opening>` event.
>
> <div class="note">
>
> <div class="title">
>
> Note
>
> </div>
>
> This event is the web equivalent to the `DesktopWindow.Activated<desktopwindow.activated>` event.
>
> </div>
>
> This code in the Shown event of a `WebListBox</api/user_interface/web/weblistbox>` adds 2 rows with 3 columns:
>
> ``` xojo
> Me.RemoveAllRows
> Me.AddRow("Row 1", "Bob", "Roberts")
> Me.AddRow("Row 2", "Barb", "Reynolds")
> ```
>
> This example sets the text of a label:
>
> ``` xojo
> If Session.LoggedIn Then
>   Me.Text = "Welcome!"
> Else
>   Me.Text = "Welcome, " + Session.UserName
> End If
> ```

## Notes

If you wish to set the background color of the chart, do so via the `Style<webchart.style>` property.

## Compatibility

|                       |     |
|-----------------------|-----|
| **Project Types**     | Web |
| **Operating Systems** | All |

<div class="seealso">

`WebUIControl</api/user_interface/web/webuicontrol>` parent class; `ChartCircularDataset</api/user_interface/charts/chartcirculardataset>`, `ChartDataset</api/user_interface/charts/chartdataset>`, `ChartLinearDataset</api/user_interface/charts/chartlineardataset>`, `ChartScatterDataset</api/user_interface/charts/chartscatterdataset>` and `ChartScatterDatapoint</api/user_interface/charts/chartscatterdatapoint>` classes.

</div>
