Code Monkey home page Code Monkey logo

naamahdaemon.github.io

Welcome to my GitHub ! No big project here, no AI, no quantic computing, only little code snippets mostly dedicated to my own use. I use the page hosted here on my web server to display various graphs taking csv files as input.

Display graph from a csv file

The simple html page hosted here allows to display simple graphs from CSV files.

An example is available on the github page of this project here : https://naamahdaemon.github.io

Installation

Copy stat.html, index.html and your csv file to your web server.

The csv file can count whatever data you want. It is up to you to generate and update the file so that your graph will be updated (in real time).

Example
I use this graph to monitor my Mina node server uptime.
A shell script parse logs on my server to generate date,ticks csv file. (this script is available to download here : https://github.com/naamahdaemon/mina-node-uptime-moniroring-script)
This file is automatically uploaded to my web server each time it is updated
Then I can display my uptime graph from my web server.

stat.html

The stat.html file displays a single CSV file.

Example
https://naamahdaemon.github.io/stat.html?source=uptime.csv&scale=1&label=TICKS&color=%233333FF

It takes the following parameters in the querystring :

  • source source csv file to display graph from. Format of the csv file should be :

    Time, Score
    YYYY-MM-DD HH:MM:SS, <SCORE>
    

    Example

    Time,Score
    2023-05-01 00:00:00,91
    2023-05-02 00:00:00,96
    2023-05-03 00:00:00,96
    
  • color HTML color code (#XXXXXX) of the graph line.

  • label Label of the graph

  • scale

    • 0 to display brut data on the graph
    • 1 to scale the graph to 0 (he graph will display the difference between the values on a y-axis origin at 0.)

index.html

The index.html page is a sample page displaying several graphs on the same page inside iframe You can modify the page and use it as is or ignore this page and make your own.

Naamah's Projects

markdown-it icon markdown-it

Markdown parser, done right. 100% CommonMark support, extensions, syntax plugins & high speed

markdown-styles icon markdown-styles

Markdown to static HTML generator and multiple CSS themes for Markdown

wpt icon wpt

Test suites for Web platform specs — including WHATWG, W3C, and others

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.