Questions & Help>Questions

Need help installing chart package

/phoenix#js#troubleshooting#package
mihai-ciupina

mihai-ciupina

Hi,

I’m having trouble installing some chart package. Either one is fine
https://www.highcharts.com/demo/line-basic
or

or you can suggest one.

So it works when simply adding this lines
<script src=“https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js”></script>
<script src=“https://code.highcharts.com/highcharts.js”></script>

but when

npm install xxx --save
require("xxx")
import("xxx")

I just cannot succed. (I previously installed jQuery and other packages with succes).

I played with the vendor folder but I’m, just not that qualified to work it out.

So the question is, how can I install chartjs or highcharts?

Thanks for help.

5 comments
/phoenix#js#troubleshooting#package
1713 5

Showing Posts 1 to 5

dokuzbir

dokuzbir

import “chart.js” should work without problem. What kind of error you get in browser console ?

0
Post #1
kokolegorille

kokolegorille

You might also specify if You use brunch or webpack, or any other tool :slight_smile:

0
Post #2
mihai-ciupina

mihai-ciupina OP

I use brunch.

  "dependencies": {
    "bootstrap": "^4.0.0",
    "chart.js": "^2.7.2",
    "copycat-brunch": "^1.1.0",
    "font-awesome": "^4.7.0",
    "jquery": "^3.3.1",
    "phoenix": "file:../deps/phoenix",
    "phoenix_html": "file:../deps/phoenix_html"
  },
  "devDependencies": {
    "babel-brunch": "6.1.1",
    "brunch": "2.10.9",
    "clean-css-brunch": "2.10.0",
    "sass-brunch": "^2.10.4",
    "uglify-js-brunch": "2.10.0"
  }
0
Post #3
mihai-ciupina

mihai-ciupina OP

reports:119 Uncaught ReferenceError: Chart is not defined

import “chart.js” won’t work.

0
Post #4
dokuzbir

dokuzbir

your chart codes in app.js or in page with script tag ?

Can you look if chart.js imported in app.js, localhost:4000/js/app.js

0
Post #5
— All posts loaded —

Where Next? Top

View thread on forum (has 5 replies!)
phoenix
js
troubleshooting
package
Home Questions & Help>Questions
0 1645 5
Last post
REPLY VIEW THREAD WITH 5 POSTS

Trending in Questions Top

stjefim
Questions & Help>Questions

Durable Workflow Execution (temporal alternative for elixir)
Hello! Suppose you are building workflow (order / task / payment) processing system with the following requirements: Each workflow con...
/oban#workflow#durable-execution
22 4198 10
New
Blokh
Questions & Help>Questions

Huge CSV processing that needs to be processed hourly - any tips?
Hey guys, I’ve got a huge CSV ( around 10 GB ) that needs to be processed hourly Do you guys have any suggestions what is the best prac...
/phoenix
10 1191 5
New
kszambelanczyk
Questions & Help>Questions

Delete file on S3 with Waffle
Hello! Could someone please give me a help/sample code, how to delete a file from s3 using waffle/waffle_ecto from Phoenix app. I creat...
/phoenix#waffle#waffle-ecto
1 695 1
New
Onor.io
Questions & Help>Questions

How To Create A Select Control From A Lookup Table?
I have what I’ve heard referred to as a “lookup table” in my database. This is a way of assigning codes to common values. One common lo...
/phoenix
3 243 5
New
jaybe78
Questions & Help>Questions

How to sync chats after dropped or broken connections in an online chat system?
Hello, I’m developing a online persistent chat system (what’s app) like using elixir/dynamodb/aws for a mobile app(flutter). The diffic...
#ets#troubleshooting#learning-elixir#chat#dynamodb
0 311 6
New
Trolleger
Questions & Help>Questions

Proper way to send channel events to multiple different people for live updates?
What approach to take when sending live updates to “random” users Hi! I have a question, I have a little chat app, and when I create a DM...
/phoenix#channels
2 689 2
New
widianto
Questions & Help>Questions

How to make first contribution to Phoenix project?
I think I’ve found a small improvement I could contribute to &lt;%= web_namespace %&gt;.CoreComponents (installer/templates/phx_web/compo...
/phoenix#contributing#open-source
5 353 5
New

Other Trending Topics Top

garrison
News>Announcing

Hobbes - a low-level distributed database for the Elixir programming language
Hobbes is a low-level distributed database for the Elixir programming language. Hobbes provides a simple, safe, and scalable storage lay...
#library#database#distributed#hobbes
302 4824 87
New
mcass19
News>Announcing

ExRatatui - Elixir bindings for the Rust ratatui terminal UI library
ExRatatui lets you cook up rich terminal UIs in Elixir, powered by Rust’s ratatui via Rustler NIFs. Build interactive terminal applicatio...
#library#rust#terminal#tui
58 2534 15
New
Damirados
News>Announcing

Emerge & Solve - a GUI framework for Elixir
Hello everyone. After busy few months I am happy to announce v0.1.0 of Emerge &amp; Solve. They are GUI (Emerge) and State management (S...
/nerves#library#frameworks#gui#native#state
59 2300 23
New
netoum
News>Announcing

Corex - Accessible and unstyled UI Phoenix components
Corex is an accessible, unstyled UI component library for Phoenix that integrates Zag.js state machines using Vanilla JavaScript and Live...
/phoenix#library#ui#liveview#hooks#accessibility#component#tableau
61 2202 19
New
wintermeyer
News>Announcing

Vutuv.de - an open-source LinkedIn alternative built in Phoenix
There are three potential reasons for members of this forum to have a look at https://vutuv.de You are tired or annoyed of LinkedIn. Yo...
/phoenix#fediverse#project
76 1722 40
New
webofbits
News>Announcing

Aludel - LLM prompt evaluation workbench
Aludel - LLM Evaluation Workbench Aludel is an embeddable Phoenix LiveView dashboard for evaluating and comparing LLM prompts across mult...
/phoenix#library#liveview#ai
27 1754 40
New
Back to top

Latest Phoenix Threads

Phoenix Forum ❯

Questions & Help>Questions

Questions Questions ❯

Latest on Elixir Forum

Elixir Forum ❯

Sponsor Spotlight

Manning

Master modern tools, write cleaner code, and tackle real-world challenges with Manning books, videos, and courses. Start building today.

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Honeybadger

Error tracking, logs, uptime, and Just Enough APM. Built for developers.

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Defacto

Bringing learning, work and compliance together since 1987.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

Software Mansion

The team behind Membrane, Popcorn, LiveDebugger. Available for hire.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

Categories:

Sub Categories:

Forums

Popular Tags

Our Sponsors

Dashbit

Build Elixir applications with speed and confidence.

EEF

Supporting innovation across the BEAM ecosystem.

Coders51

We build reliable cloud platforms for business-critical systems.

AppSignal

Catch errors, track performance, monitor hosts and more.

Honeybadger

Error tracking, logs, uptime, and Just Enough APM. Built for developers.

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Defacto

Bringing learning, work and compliance together since 1987.

ElixirCasts

Producing high quality Elixir screencasts since 2017.

Software Mansion

The team behind Membrane, Popcorn, LiveDebugger. Available for hire.

Pragmatic Studio

Courses that'll move you from confusion to "Aha, now I get it!"

View all our sponsors ❯

We're in Beta

About us Mission Statement

Options

Thread Display Mode




Thread Preview

Skip Thread Previews