Live Dynamic Charting in Wix Code (SHOWCASE)

andreas-kviby · October 23, 2018, 3:27pm

Hey there all coders!
I was building a dashboard for a client today and they wanted to see their data live updated in real time like Google Analytics real time. So I had to think a bit of it and then I succeeded to create it using Wix Code with chart.js.

This video is a preview video. The full video will be available on wixshow.com for members and hopefully also in the Wix Community Channel @code-queen

Wix Code Page Code:

gist.github.com

https://gist.github.com/wixshow/2c9bb6059d277ba3e26b88acf411911d

live-charting-data.js

// Andreas Kviby, Wix Evangelist

let chartOptions = [];
let labels = [];
let chartTitle = "LIVE CHART";
let backGroundColor = "#eeeeee";
let borderColor = "#cccccc";
let chartData = [];
let counter = 0;
let steps = 60;

This file has been truncated. show original

Wix Code HTML Component Code:

gist.github.com

https://gist.github.com/wixshow/98f25c90f9e1771bff5e76a222d73e50

lice-charting-data.html

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.4.0/Chart.min.js"></script>
<style>
</style>
<script>
window.onmessage = function(event){
  if (event.data) {
      makeChart(event.data);
}

This file has been truncated. show original

#chartjs #chart

av-promotional · December 13, 2020, 7:44pm

Both links are navigated to HTML code I would love to code the page

Topic		Replies	Views
Charts.js on Wix Code Ask the community code , question	9	1606	July 8, 2020
GRAPH Ask the community code , question	12	592	October 18, 2021
Chart.js is not working on live site. Ask the community code , question	2	152	March 10, 2021
Has anyone got Chart.js working recently? Ask the community code , question	10	321	June 20, 2022
Chart.js on wix site Ask the community code , question	14	2801	March 30, 2021

Live Dynamic Charting in Wix Code (SHOWCASE)

Related topics