软件频道>程序开发>JavaVBVCDelphiC/C++Web开发微软专栏移动数据库程序人生软件工程|开发客
您现在的位置: 天极网 > 开发频道 > ASP.NET图形开发带超链接的饼图
全文

ASP.NET图形开发带超链接的饼图

2008-07-04 11:23作者:佚名出处:天极网责任编辑:nancy

  ASP.NET的应用已经越来越多,现在我们一起研究使用图形编程在ASP.NET中实现一个带超链接的饼图。

  功能需求

  现提出如下需求,

  在ASP.NET的程序中显示一个二维的椭圆形的饼图界面。

  其中每一个饼块具有提示文本和一个超链接。

  当用户鼠标移动到某个饼块时浏览器会显示一些提示文本。

  当用户点击该饼块则链接到其他页面使得页面能显示和该饼块相关的详细信息。

  该软件的用户界面如图所示

  运行软件

  根据软件功能需求,我已经开发出了这个软件,首先演示运行一下这个软件,给大家一个直观的了解。

  演示程序中有一个pie.aspx的页面。该页面就包含了一个带超链接的饼图对象,在浏览器中打开这个页面,可以看到如下的用户界面

  这个页面中显示一个饼图,每一个扇型都显示数据库中一个客户的总订单金额,总共显示了10个客户。我们鼠标移动到一个饼图项目上,可以显示出这个客户的名称和订单金额。当鼠标点击饼图项目时,就会链接到另外一个页面。该页面也显示一个饼图,其中的项目用于显示单个订单的金额。鼠标放在某个项目上可以看到订单的时间,地点,订单人姓名和订单金额。

  在这里,第一个页面为主页面,第二个页面为明细页面。我们察看主页面的HTML代码,可以看到代码为

<img src='pieimage.aspx?name=pie_customers' usemap='#dea88afea25748bda1ae28aa3e260d1a' 
    border='0' /> 
<map name="dea88afea25748bda1ae28aa3e260d1a"> 
    <area shape="poly" coords="200,150,399,145,400,150," href="pie_orders.aspx?customerid=ALFKI" 
        title="客户名称:三川实业有限公司订单金额:518.7 点击察看该客户订单的详细情况" /> 
    <area shape="poly" coords="200,150,397,125,399,135,399,145," href="pie_orders.aspx?customerid=ANATR" 
        title="客户名称:东南实业订单金额:2581.95 点击察看该客户订单的详细情况" /> 
    <area shape="poly" coords="200,150,372,73,376,79,380,85,384,92,387,98,390,105,393,111,395,118,397,125," 
        href="pie_orders.aspx?customerid=ANTON" title="客户名称:坦森行贸易订单金额:7023.97 点击察看该客户订单的详细情况" /> 
    <area shape="poly" coords="200,150,269,9,285,14,300,20,314,27,328,34,340,43,352,52,362,62,372,73," 
        href="pie_orders.aspx?customerid=AROUT" title="客户名称:国顶有限公司订单金额:12899.15 点击察看该客户订单的详细情况" /> 
    </map>

  我们使用图片来显示饼图图形,使用map元素来在图片上设置提示文本和超链接,使用多边形来模拟扇形的超链接区域。明细页面也类似。

共8页。 1 2 3 4 5 下一页 末页
相关搜索:
关注此文读者还看过
文章排行
本周
本月
最近更新
关于我们|About us|网站律师|天极服务|电子杂志|RSS订阅|加入我们|网站地图
TMG
Copyright (C) 1999-2009 Chinabyte.com, All Rights Reserved 版权所有 天极网络
商务联系、网站内容、合作建议:010-82657868
版权声明 在线提交意见反馈 渝ICP证B2-20030003号
经营性网站备案信息 网警备案 中国网站排名
天极传媒:天极网|比特网|IT专家网|IT商网|52PK游戏网|IT分众