Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >django 模板中使用 widthratio 标签实现 乘法、除法 运算

django 模板中使用 widthratio 标签实现 乘法、除法 运算

作者头像
卓越笔记
发布于 2023-02-18 06:18:07
发布于 2023-02-18 06:18:07
1K00
代码可运行
举报
文章被收录于专栏:卓越笔记卓越笔记
运行总次数:0
代码可运行

先看官方文档

http://doc.codingdict.com/django/ref/templates/builtins.html#std:templatetag-widthratio(中文)

https://docs.djangoproject.com/zh-hans/2.2/ref/templates/builtins/#std:templatetag-widthratio(英文)

For creating bar charts and such, this tag calculates the ratio of a given value to a maximum value, and then applies that ratio to a constant.

为了创建条形图等,widthratio 标签计算给定值与最大值的比率,然后将该比率应用于常量。

例子:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
<img src="bar.png" alt="Bar"
     height="10" width="{% widthratio this_value max_value max_width %}">

If this_value is 175, max_value is 200, and max_width is 100, the image in the above example will be 88 pixels wide (because 175/200 = .875; .875 * 100 = 87.5 which is rounded up to 88).

如果 this_value 是175,max_value 是 200,并且 max_width 是 100,则上述示例中的图像将是88像素宽(因为 175 / 200 = .875; .875 * 100 = 87.5,上舍入为 88)。

widthratio 乘法

也就是把第二个参数改成数字:1

{% widthratio this_value 1 max_width %}

widthratio 除法

也就是把最后一个参数改成数字:1

{% widthratio this_value max_value 1 %}

模板减法

{{ value | add:-10 }}

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-3-29 2,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
django模板中做一些基本运算
{{value|add:-10}} value=5,则返回-5,这个比较好理解,减法就是加一个负数
菲宇
2019/08/14
1.9K0
Django内置模板标签
控制自动转义是否可用。参数是on或off。 该标签会以一个endautoescape作为结束标签. 例如: {% autoescape on %} {{ body }} {% endautoescape %} 2. block block标签可以被子模板覆盖。 3. comment 在{% comment %}和{% endcomment %}之间的内容会被忽略,作为注释。 比如,当要注释掉一些代码时,可以用此来记录代码被注释掉的原因。 例如: <p>Rendered text with {{ pub_date|date:"c" }}</p> {% comment "Optional note" %} <p>Commented out text with {{ create_date|date:"c" }}</p> {% endcomment %} comment标签不能嵌套使用。 4. csrf_token 这个标签用于跨站请求伪造保护。常用于为form表单提供csrf令牌。 5. cycle 每当这个标签被访问,返回它的下一个元素。第一次访问返回第一个元素,第二次访问返回第二个参数,以此类推. 一旦所有的变量都被访问过了,就会回到最开始的地方,重复下去。这个标签在循环中特别有用: {% for o in some_list %} <tr class="{% cycle 'row1' 'row2'%}"> ... </tr> {% endfor %} 第一次迭代产生的HTML引用了row1类,第二次则是row2类,第三次又是row1 类,如此类推。 cycle的本质是根据某个规律,提供某种特性,比如想循环给表格的行添加底色等等。 也可以使用变量, 例如,如果你有两个模版变量:rowvalue1和rowvalue2, 可以让他们的值像这样替换: {% for o in some_list %} <tr class="{% cycle rowvalue1 rowvalue2 %}"> ... </tr> {% endfor %} 被包含在cycle中的变量将会被转义。 可以禁止自动转义: {% for o in some_list %} <tr class="{% autoescape off %}{% cycle rowvalue1 rowvalue2 %}{% endautoescape %}"> ... </tr> {% endfor %} 可以混合使用变量和字符串: {% for o in some_list %} <tr class="{% cycle 'row1' rowvalue2 'row3' %}"> ... </tr> {% endfor %} 在某些情况下,可能需要连续引用一个当前循环的值,而不前进到下一个循环值。要达到这个目的,只需使用as来给{% cycle %}取一个别名,就像这样: {% cycle 'row1' 'row2' as rowcolors %} 从那时起(设置别名后),你可以将别名当作一个模板变量进行引用,从而随意在模板中插入当前循环的值。 如果要将循环值移动到原始cycle标记的下一个值,可以使用另一个cycle标记并指定变量的名称。看下面的例子: <tr> <td class="{% cycle 'row1' 'row2' as rowcolors %}">...</td> <td class="{{ rowcolors }}">...</td> </tr> <tr> <td class="{% cycle rowcolors %}">...</td> <td class="{{ rowcolors }}">...</td> </tr> 将输出: <tr> <td class="row1">...</td> <td class="row1">...</td> </tr> <tr> <td class="row2">...</td> <td class="row2">...</td> </tr> cycle 标签中,通过空格分割,可以使用任意数量的值。被包含在单引号(')或者双引号(")中的值被认为是可迭代字符串,相反,没有被引号包围的值被当作模版变量。 6. debug 输出整个调试信息,包括当前上下文和导入的模块。 7. extends 表示当前模板继承自一个父模板。 这个标签可以有两种用法: {% extends "ba
菲宇
2019/08/14
1.6K0
Django模板标签
==, !=, >=, <=, >, < and, or, not, in, not in这些操作符都可以在模板中使用
星哥玩云
2022/09/14
2K0
JSP版本的KindEidtor在线编辑器第二季:Servlet+Struts2集成版
前段时间我在论坛上发布了一篇名为 《JSP版的完善KindEditor在线编辑器(带附件上传与图片按日期分类管理功能)》 得到了大家的积极响应,不过令我觉得有点遗憾的是,有很多人都不是真的讨论技术问题,而是向我索取源码,说实在的自已的劳动成果就这样白白奉献出来,觉得有点对不起自己了,要知道我们国内的技术员都是没有金钱后盾啊。唉,最近都太忙了就没有怎么太在意这件事,今晚刚好有空过来看看。看了那么多人留下的印记后,觉得自己也应该要无私一下才是吧,咱老毛说的对:要像雷锋同志学习,呵呵…… 其实在上面我已经说过了,这个JAR里面的功能我只是把官网的JSP代码改编而已,废话就先不多说了,下面直接上码吧,可要接稳了哦。
凡梦星尘
2024/11/20
770
如何快速构建一个核酸点服务状态查询Web应用?Python实例详解
设计模式实软件中常见问题的典型解决方案。能根据需求进行预制蓝图,可用于解决代码中反复出现的设计问题。高质量应用程序框架设计过程广泛使用设计模式来确保代码可复用和可扩展性。
用户8949263
2022/04/08
1.3K0
如何快速构建一个核酸点服务状态查询Web应用?Python实例详解
30行代码用streamlit构建你的机器学习模型应用
Streamlit是一个快速构建数据分析和机器学习Web页面的开源Python库。
lyhue1991
2023/02/23
1.6K0
30行代码用streamlit构建你的机器学习模型应用
AngularJS引入Echarts的Demo
最近要用到图表展示,想了想,还是首选Echarts,HighCharts和D3.js备用吧,
JQ实验室
2022/02/09
5510
休闲娱乐|手把手教你在Python中使用turtle模块实现二次元少女(一)
小假期悄然走去,选题的任务还未完成,趁着年轻活力的余热好好找找资料来梳理下。今天想要学习的Python语言中的 turtle模块 工具。
六月暴雪飞梨花
2024/04/07
1K5
休闲娱乐|手把手教你在Python中使用turtle模块实现二次元少女(一)
PyZelda 源码解析(全)
ApacheCN_飞龙
2024/02/17
3490
Django模板语言与视图(view)
  的命名包括任何字母数字以及下划线 ("_")的组合(不提倡数字开头)。 变量名称中
py3study
2020/01/19
3.7K0
Django模板语言与视图(view)
Echarts多Y轴探索
ECharts,一个纯 Javascript 的图表库,可以流畅的运行在 PC 和移动设备上,兼容当前绝大部分浏览器(IE8/9/10/11,Chrome,Firefox,Safari等),底层依赖轻量级的 Canvas 类库 ZRender,提供直观,生动,可交互,可高度个性化定制的数据可视化图表。
孟君
2019/09/24
5.1K0
Echarts多Y轴探索
灵动岛前端Ui
当用户收到信息后,iPhone 14 Pro显示屏上方的灵动岛可以展开显示信息。此外灵动岛还可以显示音乐播放、Siri等组件,让用户在首页直接完成各种功能控制和信息阅读。iPhone 14 Pro 拥有6.1英寸屏幕,还将推出6.7英寸的iPhone 14 Pro MAX [2]
天天Lotay
2022/12/27
9650
灵动岛前端Ui
我至今没想到,我也能在 CSS 中实现 SVG 动画了
动画是网络中不可或缺的一部分。与互联网早期使用 GIF 图像不同,现在的动画更加细腻和高雅。设计师和前端开发者利用动画使网站看起来更加精致,不仅提升用户体验,还吸引用户关注重要的元素,以传达信息。
前端修罗场
2023/10/07
2.2K0
Django的主体页面抽取(七)
在潦草的完成了注册与登录之后,下面开始编写平台的主体部分了。 忘记密码和恢复密码部分在最后完善的时候补上。
zx钟
2019/07/19
9060
HarmonyOS-Codelabs系列挑战之构建你的数据应用
整体上是在官方的Demo基础上做的,这里把官方的Demo放在这里,感兴趣小伙伴可以看看:【JS基础组件】switch、chart的使用
山河已无恙
2023/03/02
3030
Matplotlib绘制动图遇到Writer问题,自己写gif保存的代码
最近使用Matplotlib绘制动图时,在保存图片为GIF图时遇到TypeError: 'MovieWriterRegistry' object is not an iterator(或者会提示MovieWriter ffmpeg unavailable.)。
蛰虫始航
2020/05/12
1.5K0
(六十七)c#Winform自定义控件-柱状图
GitHub:https://github.com/kwwwvagaa/NetWinformControl
冰封一夏
2019/09/29
5530
(六十七)c#Winform自定义控件-柱状图
Hexo tag 外挂标签
样式展示链接 基于 Butterfly 主题魔改的样式查阅 这里仅包括: 自定义标签、 文本段落、 复选框、 富文本按钮、 Folding、 密码样式的文本、 时间线 、 Link。
花猪
2022/02/22
1.9K0
Python要点总结,我使用了100个小例子!
类型检查是一个验证和施加类型约束的过程,编译器或解释器通常在编译或运行阶段做类型检查。例如,你不能拿一个string类型值除以浮点数。
石晓文
2019/11/12
6740
silverlight版的图片轮换广告
今天下午模仿公司的Flash版图片广告做了一个silverlight版的图片轮换广告,10秒轮换一次 xaml代码: 1<UserControl 2 xmlns="http://schema
菩提树下的杨过
2018/01/23
1.2K0
silverlight版的图片轮换广告
相关推荐
django模板中做一些基本运算
更多 >
交个朋友
加入前端趋势交流群
追踪前端新趋势 交流学习心得
加入前端工作实战群
前端工程化实践 组件库开发经验分享
加入前端学习入门群
前端基础系统教学 经验分享避坑指南
换一批
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档