Skip to content

Commit

Permalink
Adding readme for importmaps
Browse files Browse the repository at this point in the history
  • Loading branch information
fzf committed Oct 1, 2024
1 parent e5eff19 commit 18e500d
Showing 1 changed file with 42 additions and 0 deletions.
42 changes: 42 additions & 0 deletions docs/web-support/rails.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,3 +19,45 @@ window.ApexCharts = require("apexcharts") // expose to window
import ApexCharts from 'apexcharts'
window.ApexCharts = ApexCharts
```

Or, if you use `importmaps', you can:

Download to local vendor directory (optional but recommended)

```bash
$ wget -O vendor/javascript/apexcharts.esm.js https://ga.jspm.io/npm:apexcharts@3.53.0/dist/apexcharts.esm.js`
```

Pin "apexcharts" in config/importmap.rb to local esm file (if you do No. 1):

```ruby
pin "apexcharts", to: "apexcharts.esm.js"`
```

or, to CDN URL

```ruby
pin "apexcharts", to: "https://ga.jspm.io/npm:apexcharts@3.53.0/dist/apexcharts.esm.js"`
```

Import and assign to window in app/javascript/application.js

```js
import ApexCharts from "apexcharts"
window.ApexCharts = ApexCharts
```

Use it with options `module: true`
For example:

```
<% series = [{
name: "Desktops",
data: [10, 41, 35, 51, 49, 62, 69, 91, 148]
}]
options = {
module: true
}
%>
<%= line_chart(series, options) %>
```

0 comments on commit 18e500d

Please sign in to comment.