<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>svg</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>
</body>
</html>
<script type="text/javascript">
(
function(){
var arr = new Array();
arr.push({x:0,y:10});
arr.push({x:2,y:2});
arr.push({x:4,y:8});
arr.push({x:6,y:5});
arr.push({x:8,y:7});
arr.push({x:10,y:0});
//最大值和最小值构成的矩形
function ChartRect(){
this.maxX = null;
this.minX = null;
this.maxY = null;
this.minY = null;
}
function Point(){
this.x = 0;
this.y = 0;
}
//绘制图像
function draw(width,height,arr,xLabel,yLabel,xTages,yTages,bottom,left){
var rect = getChartRect(arr);
var svg = createChart(500,400,'测试绘图');
var points = "";
//TODO draw x,y labels and tags
var unitY = (height-bottom-20)/(rect.maxY-rect.minY);
var unitX = (width-left-20)/(rect.maxX-rect.minX);
for(var i = 0; i < arr.length ; i++){
var pp = calPosition(arr[i],left,bottom,height,unitX,unitY)
points = points + pp.x + "," + pp.y + " ";
}
var line = document.createElementNS('http://www.w3.org/2000/svg','polyline');
line.setAttribute("points",points);
line.setAttribute("fill","white");
line.setAttribute("stroke","red");
line.setAttribute("stroke-width","2");
svg.appendChild(line);
var xl = createLine({x:left,y:0},{x:left,y:height});
svg.appendChild(xl);
var yl = createLine({x:0,y:height-bottom},{x:width,y:height-bottom});
svg.appendChild(yl);
}
function createLine(start,end){
var line = document.createElementNS('http://www.w3.org/2000/svg','line');
line.setAttribute("x1",start.x);
line.setAttribute("y1",start.y);
line.setAttribute("x2",end.x);
line.setAttribute("y2",end.y);
line.setAttribute("fill","white");
line.setAttribute("stroke","blue");
line.setAttribute("stroke-width","2");
return line;
}
//根据原始点获取坐标位置
function calPosition(po,left,bottom,height,unitX,unitY){
var point = new Point();
var oY = height-bottom;
var oX = left;
point.x = oX + po.x * unitX;
point.y = oY - po.y * unitY;
return point;
}
//var px = calPosition({x:10,y:19},10,10,400,10,10);
//alert(px.x + ' ' + px.y);
draw(500,400,arr,'x','y','xt','yt',10,10);
//得到矩形
function getChartRect(arr){
var rect = new ChartRect();
for(var i = 0;i<arr.length;i++){
var p = arr[i];
if(rect.maxX == null || p.x > rect.maxX){
rect.maxX = p.x;
}
if(rect.minX == null || p.x <rect.minX){
rect.minX = p.x;
}
if(rect.maxY == null || p.y > rect.maxY){
rect.maxY = p.y;
}
if(rect.minY == null || p.y <rect.minY){
rect.minY = p.y;
}
}
return rect;
}
//创建绘图
function createChart(width,height,title){
var svg=document.createElementNS('http://www.w3.org/2000/svg','svg');
svg.setAttribute("height",height);
svg.setAttribute("width",width);
var header = document.createElementNS('http://www.w3.org/2000/svg','text');
header.setAttribute("id","headerx");
header.setAttribute("x",10);
header.setAttribute("y",10);
header.textContent = "报表测试";
header.setAttribute("fill",'black');
svg.appendChild(header);
var body=document.getElementsByTagName('body')[0];
body.appendChild(svg);
return svg;
}
}
)();
</script>
仅仅在chrome上测试过。


- 大小: 18.1 KB
分享到:
相关推荐
在实际应用中,这样的年表图表可以用于项目管理、历史分析或者个人日程规划。通过Python脚本自动化创建,能够大大提升效率,特别是在处理大量事件时。同时,由于Graphviz的强大布局算法,生成的图表会尽可能地美观且...
从压缩包内的文件名来看,“Draw2D备忘 - 技术源于生活 - CSDN博客.mht”可能是一篇关于Draw2D的博客文章,Draw2D是一个开源的Java图形库,用于在Java应用程序中创建2D图形和交互式图表。文章可能涵盖了Draw2D库的...
Graphviz是一款强大的开源图形绘制工具,它能够帮助用户自动生成各种复杂的图表,包括但不限于流程图、网络图、时间序列图等。在这个特定的压缩包中,我们关注的是如何使用Graphviz来自动根据文件生成时间序列图。这...
基于arm64版本的docker-compose文件
台区终端电科院送检文档
埃夫特机器人Ethernet IP 通讯配置步骤
rv320e机器人重型关节行星摆线减速传动装置研发
气缸驱动爬杆机器人的设计().zip
56tgyhujikolp[
内容概要:本文档提供了基于OpenCV的数字身份验证系统的Python代码示例,涵盖人脸检测、训练和识别三个主要功能模块。首先,通过调用OpenCV的CascadeClassifier加载预训练模型,实现人脸检测并采集多张人脸图像用于后续训练。接着,利用LBPH(局部二值模式直方图)算法对面部特征进行训练,生成训练数据集。最后,在实际应用中,系统能够实时捕获视频流,对比已有的人脸数据库完成身份验证。此外,还介绍了必要的环境配置如依赖库安装、文件路径设置以及摄像头兼容性的处理。 适合人群:对计算机视觉感兴趣的研发人员,尤其是希望深入了解OpenCV库及其在人脸识别领域的应用者。 使用场景及目标:适用于构建安全认证系统的企业或机构,旨在提高出入管理的安全性和效率。具体应用场景包括但不限于门禁控制系统、考勤打卡机等。 其他说明:文中提供的代码片段仅为基本框架,可根据实际需求调整参数优化性能。同时提醒开发者注意隐私保护法规,合法合规地收集和使用个人生物识别信息。
内容概要:本文档详细介绍了Java并发编程的核心知识点,涵盖基础知识、并发理论、线程池、并发容器、并发队列及并发工具类等方面。主要内容包括但不限于:多线程应用场景及其优劣、线程与进程的区别、线程同步方法、线程池的工作原理及配置、常见并发容器的特点及使用场景、并发队列的分类及常用队列介绍、以及常用的并发工具类。文档旨在帮助开发者深入理解和掌握Java并发编程的关键技术和最佳实践。 适合人群:具备一定Java编程经验的研发人员,尤其是希望深入了解并发编程机制、提高多线程应用性能的中级及以上水平的Java开发者。 使用场景及目标:①帮助开发者理解并发编程的基本概念和技术细节;②指导开发者在实际项目中合理运用多线程和并发工具,提升应用程序的性能和可靠性;③为准备Java技术面试的候选人提供全面的知识参考。 其他说明:文档内容详尽,适合用作深度学习资料或面试复习指南。建议读者结合实际编码练习,逐步掌握并发编程技巧。文中提到的多种并发工具类和容器,均附有具体的应用场景和注意事项,有助于读者更好地应用于实际工作中。
这个数据集包含了日常步数统计、睡眠时长、活跃分钟数以及消耗的卡路里,是个人健康与健身追踪的一部分。 该数据集非常适合用于以下实践: 数据清洗:现实世界中的数据往往包含缺失值、异常值或不一致之处。例如,某些天的步数可能缺失,或者存在不切实际的数值(如10,000小时的睡眠或负数的卡路里消耗)。通过处理这些问题,可以学习如何清理和准备数据进行分析。 探索性分析(发现日常习惯中的模式):可以通过分析找出日常生活中的模式和趋势,比如一周中哪一天人们通常走得最多,或是睡眠时间与活跃程度之间的关系等。 构建可视化图表(步数趋势、睡眠与活动对比图):将数据转换成易于理解的图形形式,有助于更直观地看出数据的趋势和关联。例如,绘制步数随时间变化的趋势图,或是比较睡眠时间和活动量之间的关系图。 数据叙事(将个人风格的追踪转化为可操作的见解):通过讲述故事的方式,把从数据中得到的洞察变成具体的行动建议。例如,根据某人特定时间段内的活动水平和睡眠质量,提供改善健康状况的具体建议。
资源内项目源码是来自个人的毕业设计,代码都测试ok,包含源码、数据集、可视化页面和部署说明,可产生核心指标曲线图、混淆矩阵、F1分数曲线、精确率-召回率曲线、验证集预测结果、标签分布图。都是运行成功后才上传资源,毕设答辩评审绝对信服的保底85分以上,放心下载使用,拿来就能用。包含源码、数据集、可视化页面和部署说明一站式服务,拿来就能用的绝对好资源!!! 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、大作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.txt文件,仅供学习参考, 切勿用于商业用途。
nginx
资源内项目源码是来自个人的毕业设计,代码都测试ok,包含源码、数据集、可视化页面和部署说明,可产生核心指标曲线图、混淆矩阵、F1分数曲线、精确率-召回率曲线、验证集预测结果、标签分布图。都是运行成功后才上传资源,毕设答辩评审绝对信服的保底85分以上,放心下载使用,拿来就能用。包含源码、数据集、可视化页面和部署说明一站式服务,拿来就能用的绝对好资源!!! 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、大作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.txt文件,仅供学习参考, 切勿用于商业用途。
资源内项目源码是来自个人的毕业设计,代码都测试ok,包含源码、数据集、可视化页面和部署说明,可产生核心指标曲线图、混淆矩阵、F1分数曲线、精确率-召回率曲线、验证集预测结果、标签分布图。都是运行成功后才上传资源,毕设答辩评审绝对信服的保底85分以上,放心下载使用,拿来就能用。包含源码、数据集、可视化页面和部署说明一站式服务,拿来就能用的绝对好资源!!! 项目备注 1、该资源内项目代码都经过测试运行成功,功能ok的情况下才上传的,请放心下载使用! 2、本项目适合计算机相关专业(如计科、人工智能、通信工程、自动化、电子信息等)的在校学生、老师或者企业员工下载学习,也适合小白学习进阶,当然也可作为毕设项目、课程设计、大作业、项目初期立项演示等。 3、如果基础还行,也可在此代码基础上进行修改,以实现其他功能,也可用于毕设、课设、作业等。 下载后请首先打开README.txt文件,仅供学习参考, 切勿用于商业用途。
模拟知识付费小程序,可流量主运营模式
什么是普通上传 调用接口一次性完成一个文件的上传。 普通上传2个缺点 文件无法续传,比如上传了一个比较大的文件,中间突然断掉了,需要重来 大文件上传太慢 解决方案 分片上传
英二2010-2021阅读理解 Part A 题干单词(补).pdf
2023-04-06-项目笔记-第四百五十五阶段-课前小分享_小分享1.坚持提交gitee 小分享2.作业中提交代码 小分享3.写代码注意代码风格 4.3.1变量的使用 4.4变量的作用域与生命周期 4.4.1局部变量的作用域 4.4.2全局变量的作用域 4.4.2.1全局变量的作用域_1 4.4.2.453局变量的作用域_453- 2025-04-01