首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

用 excalidraw 做生日礼物

小贝的生日正好赶上双节,思虑良久,觉得传统的贺卡,生日礼物之外,作为一个程序员,我还能给她做一个更好的礼物。然而我是一个扁鹊都望而旋走的重度拖延症患者,事情不拖到最后一刻不会启动。...到了娃儿生日前夕,本想用 scratch 写个小游戏祝福她,没想到人家已经用 scratch 把姐姐做的 wings of fire 游戏改吧改吧给自己做了个 happy birthday 的动画:...我先是去 canva 碰了碰运气,无奈发现没有合适的支票模板。google 倒是能搜到一大堆图片,但我又不太会 Photoshop 大法。思来想去,我决定用 excalidraw 自己「画」一个。...Excalidraw 是我个人最喜爱的画图工具,我之前有文章(用 Excalidraw 更好地记录和表达)介绍过用法。平日里我总是使用它来琢磨想法,梳理流程,甚至做代码的阅读笔记。...上述排版打印效果很差,一张 A4 纸放 12 张 「支票」,每张都很小,于是我索性一张纸排三个: 最后经过裁剪,小贝拿到了这样一本 12 页的可兑换「支票」: 虽然生日当天,小贝最喜欢的礼物是妈妈送的一盒贝壳

23250
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    JS:用rem来做响应式开发

    电脑版的商城昨晚做完了,今天赶着做手机端的,提到手机端的网站第一个想到的就是要 适应不同手机屏幕的宽度,保证在不同手机上都能正常显示给用户,我之前做这类网站都是无脑引进bootstrap的。...但前一个项目做完之后我发现bootstrap虽好,但里面的各种样式我利用的很少,最多用到它排版,当网站最后上传的时候你会发现,即使压缩之后,它也会占用相当大的一部分,所以这次我想自己用原生写,响应式开发...(你还可以设置更多节点) 用媒体查询的话要保证每个像素下都有对应的适配效果显然你要设置更小的宽度范围; 3.还有就是css3的单位rem: rem就是将根节点html的font-size的值作为整个页面的基准尺寸...那就要用到js在页面加载时获取window的宽度(浏览器窗口的宽度)$(window).width();在开发手机页面的时候,一般我们设置最大宽度为640px,因为640px可以保证在至今最宽的手机上显示时网页两端刚好贴合屏幕...height:10.6rem; border:1px solid #000; box-sizing: border-box; } js

    6.2K10

    用 Three.js 画个 3D 生日蛋糕送给他(她)

    作为整天和 UI 打交道的前端工程师,是否想在他(她)生日的时候用代码送上一份惊喜呢? 不妨用 Three.js 做个 3D 的蛋糕送给 ta,既浪漫又能展现你技术的魅力。...平行光:平行的光线 环境光:均匀照射每个地方 聚光灯:舞台聚光灯的光源 三维场景中的物体有很多种,比如永远面向相机的平面是 Sprite(我们做“漫天花雨”效果用的那个),还有由三角形构成的物体叫做 Mesh...Three.js 基础,简单做个小结: Three.js 是通过 Scene 来管理各种物体的,物体还可以分下组。...创建了 Scene 中的蛋糕的每一部分,设置好了光源、相机,用渲染器做了一帧帧的渲染,并且添加了用鼠标来改变视角的轨道控制器之后,就完成了 3D 蛋糕的制作。...下个他(她)的生日,不妨试试用 Three.js 画个蛋糕送给他(她),或许会有不一样的收获哦。

    3.6K42

    用随机数模拟生日悖论问题

    生日“悖论”其实并不是悖论,它是说在一个人数超过23人的集体中,至少有两个人生日在同一天的概率会大于0.5。因为这个理论上的概率与人们的直觉不符,才会被称为“悖论”。...计算生日概率: 假设班级有n个人,我们从反面计算至少有两个人生日相同的概率,这个反面就是每个人生日都不同的概率。...那么这个概率可以这么计算: 1.第一个同学的生日有365种选择; 2.第二的同学的生日有364种选择,这里是因为要保证每个人的生日都不同,所以已经选择过的日期不能再选。...3.第三个同学的生日有363种选择; 4.第四个同学的生日有362种选择; 5.第i个同学的生日有365 - i + 1种选择; ?...当n=23时,计算结果为0.52 随机数模拟: 用随机数设定每个人的生日。这里采用10000组随机数模拟,结果取平均值。以下是python代码: ? 由于引入了随机数,所以每次运行的结果稍有不同

    1.2K10

    我不知道还可以用 JS 做的 6 件事

    作者:Daniel 译者:前端小智 来源:js-craft JS 是一种灵活的语言,这种特性让我们经常觉得它是一门最简单的语言,也是最难掌握的语言。...我们已经知道,用变量的作用域和作用域链(即一个按顺序检索的对象列表)来进行变量名解析,而 with 语句就是用于暂修改作用域链的,其语法为: with(object) 该语句可以有效地将object添加到作用域链的头部...const book = { author: '前端小智', title: '我不知道还可以用 JS 做的 6 件事' } with(book) { console.log(author...); // 前端小智 console.log(title); // 我不知道还可以用 JS 做的 6 件事 } 使用 with语句的 JavaScript 代码很难优化,因此它的运算速度比不使用...因此,要返回实际的未定义值,请使用void运算符。它不是一个非常流行的运算符,并且很少使用。 原文:http://www.js-craft.io/blog/6...

    1.1K10

    用python程序根据出生日期判断星座

    1 问题 输入某年某月某日,用python程序来判断星座。 2 方法 先使用列表表示日期星座并分割提取日期,然后利用函数和判断语句判定日期对应的星座。...20,19,21,20,21,22,23,23,23,24,23,22] #星座表conts =['摩羯座','水瓶座','双鱼座','白羊座','金牛座','双子座','巨蟹座','狮子座','处女座','天秤座','天蝎座','射手座','摩羯座']#输入生日...,输出星座birth = input('请输入你的出生年月日,格式为:2001-02-21\n').strip(' ')#分割年月日到列表cbir=birth.split('-') #提取月数据cmonth...print(conts[int(cmonth)-1]) #直接输出星座列表对应月对应的星座 print(sign[int(cmonth)-1]) #直接输出星座列表对应月对应的星座...经过实验,证明此方法是可行的。能够很好的锻炼考虑问题的逻辑性和全面性,希望未来能学习更多方法来解决更多常见的实际问题。

    18510

    OpenCV—Node.js教程系列:用Tensorflow和Caffe“做游戏”

    在本教程中,我们将学习如何在OpenCV的DNN模块中加载来自Tensorflow和Caffe的预先训练的模型,我们将利用Node.js和OpenCV深入研究两个对象识别的例子。...示例代码链接地址: https://github.com/justadudewhohacks/opencv4nodejs/blob/master/examples/dnnTensorflowInception.js...这就是我们调整图像大小的原因,确保它最大的尺寸是224,我们用白色像素填充图像的剩余维度,比如宽度=高度(padToSquare)。...我们可以再次通过置信度来过滤结果,并将矩形绘制成每个识别对象的图像。 行动过程 为了简单起见,我将跳过绘制矩形和其他所有用于可视化的内容的代码。如果你想知道怎么做,你可以看看样本代码。...结语 这就是使用OpenCV和Node.js来神经网络识别图像中物体的过程。

    1.7K100

    用SparkStreaming做奇怪的事

    作者:尹会生 无需授权即可转载,甚至无需保留以上版权声明 Spark Steaming 是非常著名的流式计算工具,这次用它来搞一个奇葩的需求:开发给定一个日志同步服务器,日志达到10MB会同步过来一个新的文件...这个奇葩需求要注意两个点,一个是文件会不断的增加,所以要定时删除文件;另一个是"error"会在不定长的时间出现。...首先我们来搞定Spark Steaming 启动的问题,Spark Steaming 支持“文本文件 流”函数, 即textFileStream(),要是用这个调用你需要先导入一个streaming库...import org.apache.spark.streaming._ , 然后声明Streaming的入口 StreamingContext(sparkConf, Seconds(1)) 这里的...Seconds(1)是每隔多久来做一次统计,最后想要开始的时候执行 sparkstreamingcontext.start()。

    668100

    用Shape做动画

    使用StrokeDashOffset做等待提示动画 圆形的等待提示动画十分容易做,只要让它旋转就可以了: ? 但是圆形以外的形状就不容易做了,例如三角形,总不能让它单纯地旋转吧: ?...用StrokeDashArray做进度提示的基本做法就是将进度Progress通过Converter转换为分成两段的StrokeDashArray,第一段为实线,表示当前进度,第二段为空白。...属性,所以用这个类充当Storyboard和StrokeDashArray的桥梁。...其实这篇文章里并不会讨论填充动画,不过首先声明做填充动画会更方便快捷,这一段只是深入学习过程中的产物,实用价值不高。...,能用系统自带的动画或样式就尽量用系统自带的,没有设计师的情况下又想UI做得与众不同通常会做得很难看。

    2K30

    5 分钟,教你用 Python 制作一个生日提醒!

    在国内,大部分人都是过农历生日,然后借助日历工具获取农历日期对应的阳历日期,以这一天来过生!...这里还有一个痛点,即:每一年的农历生日对应的阳历日期都不一样 本篇文章将教你利用 Python 制作一个简单的生日提醒 1....'; 然后,将需要提醒用户的姓名、农历生日等数据写入 PS:这里阴历生日格式是 mm-dd,比如:10-25 1-3 查询数据 import pymysql class Birth(object):...def __get_diff(self, birth): """ 根据农历生日,获取当前日期距离的时间(天) :param birth: 农历生日,格式:...__get_diff(birth) ... 1-5 组装数据及消息推送 通过时间间隔,在提前一周、生日当天做一个提醒 最后,将组装好的消息通过企业微信机器人发送出去 import requests

    1.1K40

    【教程】OpenCV—Node.js教程系列:用Tensorflow和Caffe“做游戏”

    在本教程中,我们将学习如何在OpenCV的DNN模块中加载来自Tensorflow和Caffe的预先训练的模型,我们将利用Node.js和OpenCV深入研究两个对象识别的例子。...示例代码链接地址: https://github.com/justadudewhohacks/opencv4nodejs/blob/master/examples/dnnTensorflowInception.js...这就是我们调整图像大小的原因,确保它最大的尺寸是224,我们用白色像素填充图像的剩余维度,比如宽度=高度(padToSquare)。...我们可以再次通过置信度来过滤结果,并将矩形绘制成每个识别对象的图像。 行动过程 为了简单起见,我将跳过绘制矩形和其他所有用于可视化的内容的代码。如果你想知道怎么做,你可以看看样本代码。...让我们把汽车的图像输入网络,然后用分类名称 car 来过滤结果: 好了!现在做一些有难度的。让我们尝试…早餐桌上的物品? 结语 这就是使用OpenCV和Node.js来神经网络识别图像中物体的过程。

    2.4K80

    用 Python 做文本挖掘的流程

    预处理(对这里的高质量讨论结果的修改,下面的顺序仅限英文) 去掉抓来的数据中不需要的部分,比如 HTML TAG,只保留文本。结合 beautifulsoup 和正则表达式就可以了。...去掉长度过小的单词。len的是通常选择。 去掉 non-alpha 词。同样,可以用正则表达式完成 \W 就可以。 转换成小写。 去掉停用词。Matthew L....nltk 里面提供了好多种方式,推荐用 wordnet 的方式,这样不会出现把词过分精简,导致词丢掉原型的结果,如果实在不行,也用 snowball 吧,别用 porter,porter 的结果我个人太难接受了...重新去掉长度过小的词。是的,再来一遍。 重新去停词。上面这两部完全是为了更干净。 到这里拿到的基本上是非常干净的文本了。如果还有进一步需求,还可以根据 POS 的结果继续选择某一种或者几种词性的词。...jieba 是纯 Python 写的,Stanford 的可以通过 nltk 调用,复旦 NLP 也可以用 Python 调用。 END.

    1.7K80

    Python —— 用模块做更多的事

    在前面的学习内容中,我们唯独没有将的就是我们导入的模块,我们导入的到底是什么呢?...其实,我们导入的模块是保存在单独文件中的一段Python 代码,当你想要使用文件中的函数和数据时,在你的代码最前面 “导入”(import 即可)。...但是我们有时只是为了用模块中的某个函数,又要该怎么做呢?  ...,sys 是system 的简称,我们直接导入我们需要的函数,在后面的程序中就不用再加入sys.这个前缀了,导入sys的库的作用可以使你的代码使用操作系统,下面我们就用Python 来打印下我们正在使用的操作系统...#用点分隔版本号 #version_info 是包含如下信息的一个元组:主版本号、次版本号、小版本(修订)号 #我的是 3.7.0 依次对应:3.7.0 if sys.version_info

    39210
    领券