c语言将csv文件中的XY轴数据转换为html波形图

这篇具有很好参考价值的文章主要介绍了c语言将csv文件中的XY轴数据转换为html波形图。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

目标:
c语言实现一个最简化的csv转html波形图显示方案。

csv文件格式:
共两行数据,第一行是x轴数据,第二行是y轴数据。
csv文件名分为3段: 波形图名称,x轴名称,y轴名称。

c代码:
int csv2html_wave(csv_file_name,html_file_name);

html代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>SimpleWave</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.7.1/chart.min.js"></script>
</head>
<body>
    <canvas id="SimpleWave"  width="800" height="300" style="margin-left: 20px;"></canvas>
    <script>
        var canvas = document.getElementById('SimpleWave');
        var ctx = canvas.getContext('2d');
        var dataX = [1,2,3.5,4,5,6,7,8,9,10];//用csv第一行替换这里
        var dataY = [10,20,30,40,50,60,70,80,90,100];//用csv第二行替换这里
        var minX = Math.min.apply(null, dataX);
        var maxX = Math.max.apply(null, dataX);
        var stepX =(maxX-minX)/(dataX.length-1);
        var minY = Math.min.apply(null, dataY);
        var maxY = Math.max.apply(null, dataY);
        var stepY =(maxY-minY)/(dataY.length-1);
        var dataXY = dataX.map(function(x, index) {
            return { x: x, y: dataY[index] };
        });
        var chart = new Chart(ctx, {
            type: 'line',
            data: {
                datasets: [{
                    label: '(x=mp_avx,y=speedup)',//用csv文件名信息替换这里
                    data: dataXY,
                    borderColor: 'rgba(255, 99, 132, 1)',
                    borderWidth: 1,
                    fill: false
                }]
            },
            options: {
                animation: {
                    duration: 0
                },
                scales: {
                    x: {
                        type: 'linear',
                        position: 'bottom',
                        min: minX,
                        max: maxX,
                        ticks: {
                            stepSize: stepX,
                            callback: function(value, index, values) {
                                return value + ' ';
                            },
                            font: {
                                size: 14,
                                weight: 'bold'
                            }
                        }
                    },
                    y: {
                        min: minY,
                        max: maxY,
                        ticks: {
                            stepSize: stepY,
                            callback: function(value, index, values) {
                                return value + ' ';
                            },
                            font: {
                                size: 14,
                                weight: 'bold'
                            }
                        }
                    }
                },
                title: {
                    display: true,
                    text: 'SimpleWave'
                }
            }
        });
        chart.update();
    </script>
</body>
</html>

效果图:
c语言将csv文件中的XY轴数据转换为html波形图,c,html,c语言,html
TODO:
XY轴的箭头。
XY轴显示范围外扩,让线条显示在范围内。
这些都不重要,实现出来会增加html代码量,在c语言中没有必要。文章来源地址https://www.toymoban.com/news/detail-798643.html

到了这里,关于c语言将csv文件中的XY轴数据转换为html波形图的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • PL/SQL 中的数据导入和导出:CSV 文件格式详解

    前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站,这篇文章男女通用,看懂了就去分享给你的码吧。 在 PL/SQL 开发中,数据的导入和导出是常见的操作。本文将深入探讨如何使用 PL/SQL 导入和导出 CSV 文件格式的数据

    2024年02月12日
    浏览(58)
  • 如何使用pandas读取csv文件中的某一列数据

    使用pandas读取csv文件中的某一列数据,可以这样做: 先导入pandas模块: import pandas as pd 使用 pd.read_csv 函数读取csv文件: df = pd.read_csv(\\\"文件名.csv\\\") 使用 df[\\\"列名\\\"] 读取某一列数据: column = df[\\\"列名\\\"] 例如,如果你有一个csv文件叫做 example.csv ,并且有一列叫做 age ,你可以这样

    2024年02月13日
    浏览(45)
  • R语言【utils】——write.table(),write.csv(),write.csv2():将数据写入文件

    Package  utils  version 4.2.0 参数【x】 :要写入的对象,最好是矩阵或数据帧。如果不是,则尝试将其强制转换为数据帧。 参数【file】 :命名文件的字符串或打开用于写入的连接。“”表示向控制台输出。 参数【append】 :逻辑值。只有当 参数【file】 是一个字符串时才相关。

    2024年01月22日
    浏览(44)
  • Python提取JSON文件中的指定数据并保存在CSV或Excel表格文件内

      本文介绍基于 Python 语言,读取 JSON 格式的数据,提取其中的指定内容,并将提取到的数据保存到 .csv 格式或 .xlsx 格式的表格文件中的方法。    JSON 格式的数据在数据信息交换过程中经常使用,但是相对而言并不直观;因此,有时我们希望将 JSON 格式的数据转换为 E

    2024年02月11日
    浏览(50)
  • ROS系列——提取bag文件中的数据并保存为csv、txt格式

    实际应用中经常会用到将bag包中的topic数据,保存到csv文件或者txt文件下,然后在对数据进行分析。 其中:为bag文件名,为ros中的Topic名称,为要保存的csv文件名 举例: 其实与csv格式基本一样,只需要修改后缀即可 举例: 注:感谢吕博士提供的支持

    2024年02月14日
    浏览(52)
  • python 将txt文件转换成csv文件

    今天今天又来了一个冷门脚本!读取txt文件中的数据转换成csv文件。 比如下面文件开始有规律分布着需要提取的数据,从第三行开始提取,并且对数据进行处理,最后进行输出。 说明: 以下代码不仅仅是提取数据,还包含处理的步骤,处理的方式不进行公开, from utils.fea

    2024年02月12日
    浏览(69)
  • Python之xlsx文件与csv文件相互转换

    Python之xlsx文件与csv文件相互转换 在Python中,可以使用xlrd和csv模块来处理Excel文件和csv文件。 xlsx文件转csv文件 在2个文件之间转换,需要注意一个文件的字符转码问题。 使用第三方库pandas将xlsx文件转csv文件 csv文件转换成xlsx文件 使用pandas将csv文件转成xlsx文件

    2024年02月16日
    浏览(37)
  • Python 快速合并PDF表格转换输出CSV文件

    单位的刷脸考勤机后台系统做得比较差,只能导出每个部门的出勤统计表pdf,格式如下: 近期领导要看所有部门的考勤数据,于是动手快速写了个合并pdf并输出csv文件的脚本。 pypdf2,pdfplumber ,前者用于合并,后者用于读表格。 C: pip install pypdf2 Looking in indexes: https://pypi.tu

    2024年02月03日
    浏览(50)
  • Python读取一个csv文件并转换为Numpy矩阵

    利用pandas库读取,转为numpy矩阵 注意读取csv文件时第一行数据默认不读,因此需要给csv加一行。   运行结果  

    2024年02月12日
    浏览(40)
  • Python实现将txt文件转换成对应的excel或csv文件

    前言 本文是该专栏的第29篇,后面会持续分享python的各种干货知识,值得关注。 工作上可能会遇到这样的情况,使用python将某个txt文本,按照 行索引 和 列索引 转换成对应的excel文件或者是csv文件。 那对于这样的需求,用python如何实现呢?跟着笔者直接往下看解决方法。(

    2024年02月08日
    浏览(52)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包