纯ASP结合VML生成完美图-折线图

于 2011-04-19 15:07:00 发布
阅读量299 收藏
点赞数
分类专栏： 技术 文章标签： asp textbox behavior table office 浏览器
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yxk980/article/details/6333632
版权

<%
'不要修改以下数据，除非你知道你在做什么
'#####################################

Height=200  '//图表高度
Width=600   '//图表宽度

posX=390-Width/2  '//相对浏览器的X位置
posY=70           '//相对浏览器的Y位置

scaleX=50  '//最好为Width值的倍数
scaleY=50  '//最好为Height值的倍数

countX=Cint(Width/scaleX)
countY=Cint(Height/scaleY)

data="50,50|100,120|200,150|300,50|450,100"  '//要输入折线的点阵（竖线分隔每个组，逗号分隔每个组中的X和Y值）

TempData=Split(data,"|")
TempDataCount=UBound(TempData)+1


%>

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<!--Coding By PYPStudio-->
<title>折线图生成</title>
<style type="text/css">
<!--
.upperLine {
border-bottom-width: 1px;
border-top-style: none;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-bottom-color: #FF0000;
}
-->
</style>
</head>

<body>
<table width="80%"  border="0" align="center" cellpadding="0" cellspacing="1" class="upperLine">
  <tr>
    <td height="30" align="center"><h2><strong>折线图标题</strong></h2></td>
  </tr>
</table>
<!--生成折线图开始-->

<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
        <!--[if !mso]>
<style>
v:*         { behavior: url(#default#VML) }
o:*         { behavior: url(#default#VML) }
.shape       { behavior: url(#default#VML) }
</style>
<![endif]-->
        <style>
TD { FONT-SIZE: 9pt}
</style>

<!--总体框架-->
<v:rect style='position:absolute;left:<%=posX%>px;top:<%=posY%>px;width:<%=Width%>px;height:<%=Height%>px;z-index:-1' fillcolor='#9cf' stroked='f'>
  <v:fill rotate='t' angle='-45' focus='100%' />
</v:rect>
<!--X轴-->
<v:line style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='<%=posX%>px,<%=posY+Height%>px' to='<%=posX+Width%>px,<%=posY+Height%>px'/>
<!--Y轴-->
<v:line style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='<%=posX%>px,<%=posY%>px' to='<%=posX%>px,<%=posY+Height%>px'/>

<!--X轴刻度-->
<% For i=1 to countX+1 %>
<v:line id='_x0000_s1027' alt='' style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='<%=posX+(i-1)*scaleX%>px,<%=posY+Height%>px' to='<%=posX+(i-1)*scaleX%>px,<%=posY+Height+5%>px' strokecolor='#000000'/>
<v:shape id='_x0000_s1025' type='#_x0000_t202' alt='' style='position:absolute;left:<%=posX+(i-1)*scaleX-10%>px;top:<%=posY+Height+5%>px;width:70px;height:18px;z-index:1'>
<v:textbox inset='0px,0px,0px,0px'>
<table cellspacing='3' cellpadding='0' width='100%' height='100%'><tr><td align='left'><%=(i-1)*scaleX%></td></tr></table>
</v:textbox>
</v:shape>
<% Next %>

<!--Y轴刻度-->
<% For i=1 to countY+1 %>
<v:line id='_x0000_s1027' alt='' style='position:absolute;left:0;text-align:left;top:0;flip:y;z-index:-1' from='<%=posX-5%>px,<%=posY+Height-(i-1)*scaleY%>px' to='<%=posX+Width%>px,<%=posY+Height-(i-1)*scaleY%>px' strokecolor='#000000'/>
<% if i<>1 then %>
<v:shape id='_x0000_s1025' type='#_x0000_t202' alt='' style='position:absolute;left:<%=posX-30%>px;top:<%=posY+Height-(i-1)*scaleY-10%>px;width:70px;height:18px;z-index:1'>
<v:textbox inset='0px,0px,0px,0px'>
<table cellspacing='3' cellpadding='0' width='100%' height='100%'><tr><td align='left'><%=(i-1)*scaleY%></td></tr></table>
</v:textbox>
</v:shape>
<% End if %>
<% Next %>

<!--画点连线-->

<% For i=0 to TempDataCount %>
<% if i=0 then %>
<% showDataI=split(TempData(i),",") %>
<v:line style='position:absolute;left:0;text-align:left;top:0;z-index:1' from="<%=posX%>px,<%=posY+Height%>px" to="<%=posX+showDataI(0)%>px,<%=posY+Height-showDataI(1)%>px" coordsize="21600,21600" strokecolor="#FF0000" strokeweight="1.5"></v:line>
<% Else %>
<% showDataI=split(TempData(i-1),",") %>
<% If i<>TempDataCount then %>
<% showDataII=split(TempData(i),",") %>
<% Else %>
<% showDataII=split(TempData(i-1),",") %>
<% End if %>
<!--第 【<%=i%>】 条线-->
<v:oval style='position:absolute;left:<%=posX+showDataI(0)%>px;top:<%=posY+Height-showDataI(1)%>px;width:4px;height:4px;z-index:1' fillcolor="#FF0000" strokecolor="#FF0000"/>
<v:line style='position:absolute;left:0;text-align:left;top:0;z-index:1' from="<%=posX+showDataI(0)%>px,<%=posY+Height-showDataI(1)%>px" to="<%=posX+showDataII(0)%>px,<%=posY+Height-showDataII(1)%>px" coordsize="21600,21600" strokecolor="#FF0000" strokeweight="1.5"></v:line>
<v:shape id='_x0000_s1025' type='#_x0000_t202' alt='' style='position:absolute;left:<%=posX+showDataI(0)%>px;top:<%=posY+Height-showDataI(1)%>px;width:100px;height:18px;z-index:5'>
  <v:textbox inset='0px,0px,0px,0px'><table cellspacing='3' cellpadding='0' width='100%' height='100%'><tr><td align='left'>(<%=showDataI(0)%>,<%=showDataI(1)%>)</td></tr></table>
  </v:textbox>
</v:shape>
<% End if %>
<% Next %>

</body>
</html>

 

yxk980
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ASP网页中呈现折线图
08-24
通过ASP网页设计，在网页中完美呈现折线图，使网页内容跟各家丰富。
ASP折线图
weixin_30439067的博客
03-07 285
<% '参数含义(数组，横坐标，纵坐标，图表的宽度，图表的高度,图表标题，X轴单位，Y轴单位) function table1(stat_array,table_left,table_top,all_width,all_height,table_title,X_unit,Y_unit) dim bg_color(8) bg_color(1)="#ff1919" bg_co...
Asp生成统计折线图
03-02
Asp生成统计折线图A
折线图
weixin_30950237的博客
09-30 136
<%dim total(7,3)total(1,0)="中国经营报"total(2,0)="招聘网"total(3,0)="51Job"total(4,0)="新民晚报"total(5,0)="新闻晚报"total(6,0)="南方周末"total(7,0)="羊城晚报" total(0,1)="#FF0000,1.5,1,2,公司1"'参数1线条的颜色，参数2线条的宽度，参数3线条的类型...
ASP+VML读取数据库并生成曲线图
10-14
比如，要绘制一个简单的折线图，我们可以创建一系列的线段（line）元素，每个线段代表数据点之间的连接。每个线段的起点和终点由数据值决定。 ```xml ,100" filled="f"> ``` 在这个例子中，`data`属性定义了折线...
ASP生成柱型体，折线图，饼图源代码
10-31
上述代码中的`table2`函数就是一个生成折线图的函数，它接收多个参数，包括总数据（total）、横坐标（table_x）、纵坐标（table_y）、图表宽度（all_width）、图表高度（all_height）以及折线条数（line_no）。...
asp读取数据库中数据生成统计折线图_mdb_streamrhy_asp数据图形_折线图_asp_
10-04
本文将深入探讨如何使用ASP读取MDB（Microsoft Access）数据库中的数据，并利用VML（Vector Markup Language）生成折线图。 首先，我们需要了解ASP与MDB数据库的交互。ASP是微软提供的一种服务器端脚本技术，它允许...
ASP生成柱型体，折线图，饼图源代码提供了第1/3页
10-30
此段代码主要展示了如何利用ASP结合VML（Vector Markup Language）来生成折线图的过程。 ### ASP简介 ASP是一种服务器端脚本环境，在HTML页面中可以嵌入各种脚本语言（如VBScript或JScript），通过这些脚本可以生成...
Asp生成统计折线图源代码
06-29
很好用的东东，对ASP编程会有很大提高！！！ 推荐大家使用
Asp生成统计折线图.rar
07-05
Asp生成统计折线图
asp 做折线图，纯代码，vxml技术，非图形哦
04-08
asp 做饼状图，纯代码，vxml技术，非图形哦
纯ASP画折线图 龚鸣table2新版（支持负数，小数）
.cpp的应用开发指南
10-29 259
  &lt;% function table2(total,table_x,table_y,all_width,all_height,line_no) '参数含义(传递的数组，横坐标，纵坐标，图表的宽度，图表的高度,折线条数) '纯ASP代码生成图表函数2——折线图 '@version:2.0 '@brief: 增加负数支持，并修正小数不能正常显示的BUG, 增加...
asp版VML折线图
独孤剑的专栏
05-30 755
昨天发了个JAVASCRIPT版的VML折线图,今天再发个ASP版的.感觉网上的文章大都是照抄别人的,而且还不去自己验证,这样误导了很多读者.这里我发些自己测试过而且是自己写的文章,希望对大家能有所帮助吧.不明白的可以在我博客留言或者来我的小站交流:http://www.duku123.com先说代码:  v/:* { Beha
Asp生成统计折线图 -ASP源码.zip
12-13
ASP源码，压缩包解压密码：www.cqlsoft.com
在asp中利用vml绘制曲线图
yangzixp的专栏
07-26 1758
total(1,0)="中国经营报"total(2,0)="招聘网"total(3,0)="51Job"total(4,0)="新民晚报"total(5,0)="新闻晚报"total(6,0)="南方周末"total(7,0)="羊城晚报" total(0,1)="#FF0000,1.5,1,2,公司1"参数1线条的颜色，参数2线条的宽度，参数3线条的类型，参数4转折点的类型,参数5线条名称to
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值