2016-02-04 72 views
-1

我需要一些帮助在我的图表上绘制时间。我有一个网格,在我的html页面上横向排列有24个框。每个方框代表一个小时,并在我的电子表格中定义宽度为28px。第一个盒子从上午12点开始,然后一直到晚上11点(每天24小时)。数学计算预订期

我现在需要做的就是情节我对电网项目,唯一的问题是我无法弄清楚的数学运用到哪里工作左侧位置应该开始,有多宽是应该的。我的代码中的左边位置是基于一个百分比,0%是12AM的开始。宽度基于像素。任何人谁可以告诉我的方式吗?

所以可以说我有以下的项目,你会在左侧位置(%)和宽度(PX)是每个。我需要的只是公式真的,因为我可以工作了如何编写代码,并注入它在我的网格

Name, StartTime, EndTime 
Item 1, 9:55, 14:55 
Item 2, 16:00, 17:45 
Item 2, 18:10, 19:55 
+0

我建议使用JavaScript这样的事情 – Derek

+1

如果你只是希望公式我认为这可能是更合适的东西,如“算法”或添加标签“几何”? – whrrgarbl

+0

由于将这样做 – JK36

回答

0

你有n = 24盒,宽度w = 28 PX每个。时间可以用h小时和m分钟来表示。

本质上,你只是想弄清楚每个盒子的开始和结束,你可以将其转换为像素宽度,并将转换为为百分比。

  1. h + m/60会给你分数小时。乘以宽度以获得时间的像素位置:(h + m/60)*w。 (快速完整性检查:1:30应该是1半半宽度,即42像素。)

  2. 对于这两个时间都这样做,现在您有start_pxend_px。这可以让你计算一个width = end_px - start_px

  3. 现在你可以转换成百分比:width_percent = width/total_width * 100 = width/(w * n) * 100

因此,最终的公式应该是这样的:

start_px = (start_h + start_m/60)*w 
end_px = (end_h + end_m/60)*w 
width_percent = (end_px - start_px)/(w * n) * 100 

编辑:这里有一个快速和肮脏的Python 2脚本(正是我所掌握的)来运行一些示例。

def find_width(start_h, start_m, end_h, end_m, n, w): 
    start_px = (start_h + start_m/60.)*w 
    end_px = (end_h + end_m/60.)*w 
    width_percent = (end_px - start_px)/(w*n)*100 
    print "%d:%02d-%d:%02d Spans from %dpx to %dpx, or %.2f%%"%(start_h, start_m, end_h, end_m, start_px, end_px, width_percent) 

n = 24 # 24 hours 
w = 10 # width of 10, easier to check math 

# entire day - should be 240 px or 100% 
find_width(0,0, 24,0, n,w) 

# half day - should be 50% 
find_width(0,0, 12,0, n,w) 

# try starting from not-zero 
find_width(4,0, 16,0, n,w) 
find_width(4,30, 5,30, n,w) 

# try non-zero minutes 
find_width(4,30, 16,30, n,w) 

# try less than an hour 
find_width(4,30, 5,00, n,w) 
find_width(4,30, 4,45, n,w) 

此输出:

0:00-24:00 Spans from 0px to 240px, or 100.00% 
0:00-12:00 Spans from 0px to 120px, or 50.00% 
4:00-16:00 Spans from 40px to 160px, or 50.00% 
4:30-5:30 Spans from 45px to 55px, or 4.17% 
4:30-16:30 Spans from 45px to 165px, or 50.00% 
4:30-5:00 Spans from 45px to 50px, or 2.08% 
4:30-4:45 Spans from 45px to 47px, or 1.04%