网站开发学习笔记(一)

(一) Django+Open flash chart


概述

  Django(发音:/ˈdʒæŋɡoʊ/ JANG-goh) 是用 python语言写的开源web开发框架(open source web framework),它鼓励快速开发,并遵循MVC设计。Django遵守 BSD版权,初次发布于2005年7月, 并于2008年9月发布了第一个正式版本1.0 。最新发行版本是Django 1.3.1,于2011年09月10日发布.  Django 根据比利时的爵士音乐家Django Reinhardt命名,他是一个吉普赛人,主要以演奏吉它为主,还演奏过小提琴等。

设计哲学

  Django的主要目的是简便、快速的开发数据库驱动的网站。它强调代码复用,多个组件可以很方便的以“插件”形式服务于整个框架,Django有许多功能强大的第三方插件,你甚至可以很方便的开发出自己的工具包。这使得Django具有很强的可扩展性。它还强调快速开发和DRY(Do Not Repeat Yourself)原则。  

Django基于MVC的设计十分优美:  

  •     对象关系映射 (ORM,object-relational mapping)  以Python类形式定义你的数据模型,ORM将模型与关系数据库连接起来,你将得到一个非常容易使用的数据库API,同时你也可以在Django中使用原始的SQL语句。  
  • URL 分派  使用正则表达式匹配URL,你可以任意设计的URL,没有框架的特定限定。象你喜欢的一样灵活。  
  • 模版系统   使用Django强大而可扩展的模板语言,可以分隔设计、内容和Python代码。并且具有可继承性。  
  • 表单处理  你可以方便的生成各种表单模型,实现表单的有效性检验。可以方便的从你定义的模型实例生成相应的表单。  
  • Cache系统   可以挂在内存缓冲或其它的框架实现超级缓冲 -- 实现你所需要的粒度。  
  • 会话(session),用户登录与权限检查  快速开发用户会话功能。  
  • 国际化  内置国际化系统,方便开发出多种语言的网站。  
  • 自动化的管理界面   不需要你花大量的工作来创建人员管理和更新内容。Django自带一个ADMIN site,类似于内容管理系统

以上摘自百度百科


Django开发服务器程序是非常方便的:

1、自带一个调试专用的http服务器,对脚本的任何修改,服务器都会自动重启;

2、有完整的管理命令。可以生成数据库,添加删除字段等;

3、完善的错误信息,便于问题定位;

4、数据库自动创建功能,即便你不懂SQL语言,也能快速生成需要的数据库表

5、....


Django有非常完善的开发文档,对于开发过程很有帮助。

中文版:http://djangobook.py3k.cn/2.0/

英文版:https://docs.djangoproject.com/en/1.3/

另外,对于本地开发环境(apache++wsgi+django)的创建,网上也有详细的教程,这里就不多说了。


由于最近个人需要,在本地见了一个小网站,用于显示一个动态图表。顺便补充一下Django教程关于非HTML输出的内容。

图表使用open flash chart来实现,这是一个开源的,基于flash实现的图表显示插件。当然,要在python环境下使用这个,我们还需要对应的python库----pyofc2。这是网上教程:http://packages.python.org/PyOFC2/

还有,Django+pyofc2的示例代码:https://github.com/btbytes/djofc2_demo


但是,这些教程中对于直线图的使用都是非常简单,x轴间隔平均,并没有对每个点单独绘制的示例。看下图,数据点之间间隔不等的状态。

注:图片的左边数据密集,中间数据较少

其对应JSON数据为:

{
    "elements": [
        {
            "type": "line",
            "values": [
                {
                    "x": "1325053800",
                    "y": "5.6"
                },
                {
                    "x": "1325030160",
                    "y": "4.4"
                },
            ],
            "dot-style": {
                "type": "dot",
                "halo-size": 2,
                "dot-size": 2,
                "tip": "#date:Y-m-d H:i#
#y#"
            }
        },
        {
            "type": "shape",
            "colour": "#80FFFF",
            "values": [
                {
                    "x": 1322501258,
                    "y": 0
                },
                {
                    "x": 1322501258,
                    "y": 3.9
                },
                {
                    "x": 1325093258,
                    "y": 3.9
                },
                {
                    "x": 1325093258,
                    "y": 0
                }
            ]
        },
        {
            "type": "shape",
            "colour": "#0080FF",
            "values": [
                {
                    "x": 1322501258,
                    "y": 3.9
                },
                {
                    "x": 1322501258,
                    "y": 4.4
                },
                {
                    "x": 1325093258,
                    "y": 4.4
                },
                {
                    "x": 1325093258,
                    "y": 3.9
                }
            ]
        },
        {
            "type": "shape",
            "colour": "#00C400",
            "values": [
                {
                    "x": 1322501258,
                    "y": 4.4
                },
                {
                    "x": 1322501258,
                    "y": 7
                },
                {
                    "x": 1325093258,
                    "y": 7
                },
                {
                    "x": 1325093258,
                    "y": 4.4
                }
            ]
        },
        {
            "type": "shape",
            "colour": "#FFFF00",
            "values": [
                {
                    "x": 1322501258,
                    "y": 7
                },
                {
                    "x": 1322501258,
                    "y": 10
                },
                {
                    "x": 1325093258,
                    "y": 10
                },
                {
                    "x": 1325093258,
                    "y": 7
                }
            ]
        },
        {
            "type": "shape",
            "colour": "#FF0000",
            "values": [
                {
                    "x": 1322501258,
                    "y": 10
                },
                {
                    "x": 1322501258,
                    "y": 16
                },
                {
                    "x": 1325093258,
                    "y": 16
                },
                {
                    "x": 1325093258,
                    "y": 10
                }
            ]
        }
    ],
    "title": {
        "text": "2011-11-29~2011-12-29"
    },
    "y_axis": {
        "min": 0,
        "max": 16,
        "steps": 2
    },
    "x_axis": {
        "min": 1322501258,
        "max": 1325093258,
        "steps": 86400,
        "labels": {
            "steps": 86400,
            "visible-steps": 1,
            "text": "#date#",
            "rotate": -45
        }
    }
}
数据太多,这里只放了两个点的数据,和其他shape,x轴,y轴,tip等数据。

生成这个数据的代码如下:

def draw(request):
    #定义shape颜色
    blue, light_blue, green, yellow, red = "0x80FFFF", "0x0080FF", "0x00C400", "0xC4C400", "0xFF0000"
    currtime = time()+10800
    x_min = currtime-7776000
    act_min = mktime(strptime("2011-11-28", "%Y-%m-%d"))
    if x_min < act_min:
	x_min = act_min        
		
    #创建图表标题
    t = title(text=strftime('%Y-%m-%d', gmtime(x_min)) + "~" + strftime('%Y-%m-%d', gmtime(currtime)), style="font-size: 25px")

    #创建5个不同颜色的shape,每个shape只需要设定每个顶点的坐标,图表会自动构建闭合图形。当然如果顶点顺序设置错误,可能出现扭转的图形。
    hl = shape(colour=blue)
    hl.values = [{'x': x_min, 'y': 0},{'x': x_min, 'y': 3.9},{'x': currtime, 'y': 3.9},{'x': currtime, 'y': 0}]
    hnl = shape(colour=light_blue)
    hnl.values = [{'x': x_min, 'y': 3.9},{'x': x_min, 'y': 4.4},{'x': currtime, 'y': 4.4},{'x': currtime, 'y': 3.9}]
    hg = shape(colour=green)
    hg.values = [{'x': x_min, 'y': 4.4},{'x': x_min, 'y': 7},{'x': currtime, 'y': 7},{'x': currtime, 'y': 4.4}]
    hnh = shape(colour=yellow)
    hnh.values = [{'x': x_min, 'y': 7},{'x': x_min, 'y': 10},{'x': currtime, 'y': 10},{'x': currtime, 'y': 7}]
    hh = shape(colour=red)
    hh.values = [{'x': x_min, 'y': 10},{'x': x_min, 'y': 20},{'x': currtime, 'y': 20},{'x': currtime, 'y': 10}]
    
    #创建折线图,黑色
    b1 =  line(color="#000000")
    
    #从Django的数据库中读取model值列表
    MonitorList = []
    try:
        MonitorList = DiabetesMonitor.objects.filter(username='jitao').order_by("date","time")
    except:
        pass
    itemlist = []
    for item in MonitorList:
        #注意了,就是这里,只要想line的value中添加字典数据即可,字典包括x和y两个key
        time_value = mktime(datetime(year=item.date.year,month=item.date.month,day=item.date.day,hour=item.time.hour,minute=item.time.minute).timetuple())
        itemlist.append({"x":time_value, "y":float(item.value)})
    b1.values = itemlist

    #设置line每个数据点的tip表现形式
    b1.dot_style = {"tip":"#date:Y-m-d H:i#<br>#y#"}

    chart = open_flash_chart()
    chart.title = t    
    chart.add_element(b1)
    chart.add_element(hl)
    chart.add_element(hnl)
    chart.add_element(hg)
    chart.add_element(hnh)
    chart.add_element(hh)
    
    y = y_axis()
    #最小,最大,步长
    y.min, y.max, y.steps = 0, 20, 2
    chart.y_axis = y
    
    x = x_axis()
    x.min, x.max, x.steps = x_min, currtime, 86400	#7776000 is 90 days in seconds

    #设置x左边显示形式,这里是斜45度,每个刻度是86400秒(一天),每个刻度的内容都显示,显示方式为date日期方式
    x.labels = {"rotate":-45,"steps":86400,"visible-steps":1,"text":"#date#"}
    chart.x_axis = x 
    return HttpResponse(chart.render())


Google的Google App Engine支持Django,不过现在需要翻墙才能访问这些应用。也是由于这个原因我基于Django开发的服务器应用只能在本地使用了。

最终不得不转投新浪的云平台,它目前支持PHP。同时,java和python语言开发环境也在内测中。看我的下一篇博客,是基于PHP+open flash chart的实现


未完待续...

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值