Description:

Chart module using ApexCharts.js for MagicMirror².

I’m aware of the other chart modules out there, but I like using ApexCharts.js in my projects. Coloring via themes and its monochrome option make it a perfect match for a mirror project.

Chart data can be supplied in config or pulled from JSON api.

Screenshots:

Pie chart with default options

Same pie chart with custom options:

Bar chart with default options:

Allows for multiple charts:

Download / Instructions:

https://github.com/sharmstr/MMM-ApexCharts

Version 1

Initial release

Version 2

JSON fetch data interval added

Version 2.1

Support for stacked bar charts added
Samples added to github wiki
Added json api endpoint with sample data for testing.

Hey All,

First a big thanks to everyone. Wonderful forum with tons of help.

I’m building a mirror for my best friend for her birthday. I need to keep it simple so I dont have to provide much support. LOL. I dont have real pictures to show yet, but below is a mock up of what it will hopefully look like.

Hardware:
Raspberry Pi 3 Model B+ with 16GB
LG IPS LED Monitor (24MP48) with bezel removed
Two Way Mirrors 1/4" Smart Mirror with polished edges
NECO-X 24" IR Frame
Mini USB Microphone (probably wont work once in frame)
PS3 Eye
Dual fan for RPi (maybe)
Chrome switches
Pimoroni On-Off Shim
White braided extension cord

Frame:
4 layers of 3/4" birch plywood. Front will have a walnut stain. The sides will be painted white.

Modules:
Clock
Calendar
Compliments
Current Weather
Weather Forecast
MMM-Cursor
MMM-MyCommute
MMM-newsfeedtouch
MMM-voice MMM-Kalliope
MMM-Wunderlist-Enhanced
MMM-SystemStats (will probably remove, but good during dev)

Misc:
Remot3.it I have this set up for ssh and rdp. Works great

Cron job to reboot RPi every night at midnight.

Two buttons on the side will be used to turn the RPi off completely using the Pimoroni On-Off shim and to power the monitor off completely. I’m using MMM-voice to put the monitor in stand-by.

Enabled the Open GL driver fix. I had some issues with MMM-voice after doing this. The usb mic and display would alternate device IDs after every reboot. The fix is noted here: https://forum.magicmirror.builders/topic/7232/mmm-voice-mic-number-changes

I’m currently working on a custom version of MMM-voice that will show responses on the screen. i.e. After detection of keyword a modal will pop up to display hello message and some tips on what commands can be used. My first idea was to use MMM-TTS for the response, but I couldnt get it to work.

There was some questions on the forums about if and how well the IR frame would work when paired with a mirror. I can report that it works great. Edit: I’ve decided to not use the IR Frame. The fingerprints on the mirror were annoying. Now that I have Kalliope working well, there’s no need for the IR Frame.

I’m hoping to get the frame done this weekend. I’ll post pics of the process next week.

I have it running on the new 3 B+. Works great. I used the install instructions from the wiki.

JSON fetch interval added via chartInterval option. If option is not specified in config, the chart will only load JSON data at startup.

Thank you for the assist. Its amazing what a good mic will do. I cant get the ReSpeaker 4-mic to work, but that’s not a fault of Kalliope. I dont think it works with the new RPi’s or I received a dead one. I tested with the PS3 eye and it works great. Almost no delay. I even changed up my design to mimic yours a bit. Thank you again. You’ve been a great help here and on gitter.

@idoodler Totally agree, but for css and location changes, ctrl r saves a ton of time.

Found the solution here: https://raspberrypi.stackexchange.com/questions/80072/how-can-i-use-an-external-usb-sound-card-and-set-it-as-default

@raymondjspigot

There are several working examples in the wiki

https://github.com/sharmstr/MMM-ApexCharts/wiki/JSON

V2.1:

• Added support for stacked charts.
  

• Added a json api endpoint with sample data you can use for testing
  http://my-json-server.typicode.com/sharmstr/MMM-ApexCharts

JSON fetch interval added via chartInterval option. If option is not specified in config, the chart will only load JSON data at startup.

Description:

Chart module using ApexCharts.js for MagicMirror².

I’m aware of the other chart modules out there, but I like using ApexCharts.js in my projects. Coloring via themes and its monochrome option make it a perfect match for a mirror project.

Chart data can be supplied in config or pulled from JSON api.

Screenshots:

Pie chart with default options

Same pie chart with custom options:

Bar chart with default options:

Allows for multiple charts:

Download / Instructions:

https://github.com/sharmstr/MMM-ApexCharts

Version 1

Initial release

Version 2

JSON fetch data interval added

Version 2.1

Support for stacked bar charts added
Samples added to github wiki
Added json api endpoint with sample data for testing.

@sdetweil My jetson nano arrived a few days ago. I bought it for this purpose. Glad to hear it worked for you.

The format of the config file is important. You’re probably missing a comma or something simple. Post your file (remove any sensitive info) and someone here will be able to help.

@cyberphox said in Yet another AI for MagicMirror: This time it’s Mycroft.:

Very cool…Are you running this on a Pi? or more powerful computer?

Click on the ‘complete history’ link and you’ll see its running on a pi

The second link has instructions for disabling the screensaver.

I followed these two:

https://github.com/MichMich/MagicMirror#raspberrypi

and

https://github.com/MichMich/MagicMirror/wiki/configuring-the-raspberry-pi

I have it running on the new 3 B+. Works great. I used the install instructions from the wiki.