# Installation

Highcharts for WireBootstrap can be downloaded from [here](https://www.wirebootstrap.com/products/highcharts.html).

{% hint style="info" %}
**Note**: Highcharts for WireBootstrap does not include a license for Highcharts.  A [license for Highcharts](https://shop.highsoft.com) must be purchased separately.
{% endhint %}

## Sample Project

The download includes a sample project that demonstrates the features of Highcharts for WireBootstrap.

![Highcharts for WireBootstrap](/files/YzyqNDs056ASgwCF5m5Q)

After downloading, open the project in any web project editor. Next, open a terminal window and run the `npm first` script when running the project for the first time.  This will install the `npm` packages required to run the project and then open the default page in a new browser window.

```
npm run first
```

Use `npm start` to run the project later now that the packages are installed.

```
npm run start
```

## Assets

To use the component outside of the sample application, reference the library on a web page *after* the [Core WireBootstrap library](https://docs.wirebootstrap.com/wirebootstrap/overview). &#x20;

```javascript
<script src="./node_modules/@wirebootstrap/wire/wire.js"></script>
<script src="./wire-highcharts.js"></script>
```

## Class

Highcharts for WireBootstrap extends the [wire.ui.component](https://docs.wirebootstrap.com/wirebootstrap/reference/wire.ui/wire.ui.component) class.  As such, it inherits all the base functionality of that class.

To create a new instance of the Highcharts for WireBootstrap component, use the `wire.highcharts` class.

```javascript
const myChart = new wire.highcharts();
```

## Render

Render the component using an HTML `div` element.

```javascript
<div id="chart"></div>
...
myChart.render("#chart",{
    ...
});
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.wirebootstrap.com/highcharts/installation.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
