创意柱状图

最新推荐文章于 2024-01-28 01:28:22 发布

iteye_13385

最新推荐文章于 2024-01-28 01:28:22 发布

阅读量122

点赞数

分类专栏： [网站分类]1.网站首页原创Java技术区(对首页文章的要求: 原创、高质量、经过认真思考并精心写作。BlogJava管理团队会对首页的文章进行管理。) 文章标签： jfreechart HTML

[网站分类]1.网站首页原创Java技术区(对首页文章的要求: 原创、高质量、经过认真思考并精心写作。BlogJava管理团队会对首页的文章进行管理。) 专栏收录该内容

27 篇文章 0 订阅

订阅专栏

本来页面上是用jfreechart 绘制的数据分析图。但是由于有个页面绘制的图比较多，而且是js选择性的展示哪张图，头说都用jfreechart效率太慢了，把那简单的柱状图，拿去改改（用简单点，而且不怎么占资源的方式）。我反复思量，反复研究，终于搞出个小东西。虽然没有什么技术含量，但是却觉得自己很有创意。全部都是用最简单的HTML 元素制作的，分享下：
1.效果截图

2.简单的代码：

1

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
2

< html >
3

< head >
4

< meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" >
5

< title > Test </ title >
6

</ head >
7

8

< body >
9

< table border =0 cellpadding =0 cellspacing =0 >
10

< tr >
11

< td width =1 height =200 bgcolor =red ></ td >
12

< td width =250 >< table width ="245" border ="0" cellspacing ="0" align ="right" >
13

< tr >
14

< td width ="15" nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
15

< td width ="42" >   </ td >
16

< td width ="16" >   </ td >
17

< td width ="41" >   </ td >
18

< td width ="17" >   </ td >
19

< td width ="42" >   </ td >
20

< td width ="17" >   </ td >
21

< td width ="39" >   </ td >
22

</ tr >
23

< tr >
24

< td nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
25

< td >   </ td >
26

< td >   </ td >
27

< td >   </ td >
28

< td bgcolor ="#33CCFF" >   </ td >
29

< td >   </ td >
30

< td >   </ td >
31

< td >   </ td >
32

</ tr >
33

< tr >
34

< td nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
35

< td >   </ td >
36

< td >   </ td >
37

< td >   </ td >
38

< td bgcolor ="#33CCFF" >   </ td >
39

< td >   </ td >
40

< td >   </ td >
41

< td >   </ td >
42

</ tr >
43

< tr >
44

< td nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
45

< td >   </ td >
46

< td bgcolor ="#000000" >   </ td >
47

< td >   </ td >
48

< td bgcolor ="#33CCFF" >   </ td >
49

< td >   </ td >
50

< td >   </ td >
51

< td >   </ td >
52

</ tr >
53

< tr >
54

< td nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
55

< td >   </ td >
56

< td bgcolor ="#000000" >   </ td >
57

< td >   </ td >
58

< td bgcolor ="#33CCFF" >   </ td >
59

< td >   </ td >
60

< td bgcolor ="#FF9933" >   </ td >
61

< td >   </ td >
62

</ tr >
63

< tr >
64

< td nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
65

< td >   </ td >
66

< td bgcolor ="#000000" >   </ td >
67

< td >   </ td >
68

< td bgcolor ="#33CCFF" >   </ td >
69

< td >   </ td >
70

< td bgcolor ="#FF9933" >   </ td >
71

< td >   </ td >
72

</ tr >
73

< tr >
74

< td nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
75

< td >   </ td >
76

< td bgcolor ="#000000" >   </ td >
77

< td >   </ td >
78

< td bgcolor ="#33CCFF" >   </ td >
79

< td >   </ td >
80

< td bgcolor ="#FF9933" >   </ td >
81

< td >   </ td >
82

</ tr >
83

< tr >
84

< td nowrap bgcolor ="#FF0000" >< font color ="#FFFFFF" >   </ font ></ td >
85

< td >   </ td >
86

< td bgcolor ="#000000" >   </ td >
87

< td >   </ td >
88

< td bgcolor ="#33CCFF" >   </ td >
89

< td >   </ td >
90

< td bgcolor ="#FF9933" >   </ td >
91

< td >   </ td >
92

</ tr >
93

</ table ></ td >
94

</ tr >
95

< tr >< td colspan =2 height =1 bgcolor =red ></ td >< tr >
96

< table >
97

</ body >
98

</ html >
99

100

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
创意柱状图

本来页面上是用jfreechart 绘制的数据分析图。但是由于有个页面绘制的图比较多，而且是js选择性的展示哪张图，头说都用jfreechart效率太慢了，把那简单的柱状图，拿去改改（用简单点，而且不怎么占资源的方式）。我反复思量，反复研究，终于搞出个小东西。虽然没有什么技术含量，但是却觉得自己很有创意。全部都是用最简单的HTML 元素制作的，分享下：1.效果截图2.简单的代码： ...
复制链接

扫一扫

专栏目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。