Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >专栏 >20180902_ARTS_week10

20180902_ARTS_week10

作者头像
Bob.Chen
发布于 2018-09-27 03:33:35
发布于 2018-09-27 03:33:35
35000
代码可运行
举报
运行总次数:0
代码可运行

第十周,算法题 Container With Most Water,看了一篇介绍 VS Code 插件和技巧的文章,介绍一个做圆形轨迹拖动时用向量来计算顺时针逆的方法,继续分享了阅读《暗时间》时关于逆人性的一些感想。

Algorithm

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
/**
 * 
 * Container With Most Water
 * https://leetcode.com/problems/container-with-most-water/description/
 * 
 * @param {number[]} height
 * @return {number}
 */
var maxArea = function (height) {
    var area = 0,
        left = 0,
        right = height.length - 1;

    while (left < right) {
        var curLeftHeight = height[left];
        var curRightHeight =height[right];
        var curHeight = Math.min(curLeftHeight, curRightHeight);
        var tmpArea = curHeight * (right - left)

        if (tmpArea > area) {
            area = tmpArea;
        }

        if (curLeftHeight < curRightHeight) {
            left += 1;
        } else {
            right -= 1;
        }
    }

    return area;
};

console.log(maxArea([1, 8, 6, 2, 5, 4, 8, 3, 7]) ) // 49

这周因为有些事情忙,挑了条 easy 难度的题。整个思路比较简单,算面积嘛,然后左右两边分别有两个游标,哪个低了哪个就往中间移动一格。复杂度 O(n)。

Review

Pro tips for Visual Studio Code to be productive in 2018

https://medium.com/@i_AnkurBiswas/pro-tips-for-visual-studio-code-to-be-productive-in-2018-d5252e914561

文章中作者介绍了几个 VS Code 的插件和几个使用技巧,挑几个实用的说说。

  1. Gitlens。 这是一个插件,用来告诉你每一行代码是由何人何时提交的。
  2. Live Share。同样是个插件,据说可以实时共享 workspace,实时修改,小组 debug。特别适合远程讨论的场景。不过注意还是开发者预览版本。
  3. Json to Code。这个插件感觉会很有用,当你的 API 是 json 的时候,可以通过 json 数据直接生成对应的强类型的结构代码。支持生成 TypeScriptPython,Go,C#,Java,JavaScript 等等。
  4. 全局改名。这个小技巧就是当改变变量或者方法名时,通过 F2 可以改变调用的地方,如果只想改当前文件,可以用 Command + F2 或者 Ctrl + F2
  5. 同时修改多行。这个技巧用过 sublime text 的应该很熟悉,就是多点几个光标出来,然后同时操作。文章中说是 Option,我 Mac 是实测是 Command,可能跟我用的是 sublime 的键位有关系。
  6. 保存全部。这个功能的快捷键并没有默认提供,可以自己在 Keyboard Shortcuts 创建。

Tip

记录一下之前页面上要做一个效果,一个图片要能在页面上的一个固定的圆形路径上拖动。这里有个难点就是顺时针和逆时针的判断。

因为通过三角函数,我们算出来的角度是不会大于 180 度的,假设用户从12 点方向开始拖动,到六点方向之后,继续拖,角度就变成 179 度了,如果不知道方向就没办法继续定位了。

这里可以用向量叉积的方法来判断顺时针还是逆时针。

设圆心,起始点,移动的点分别为 A(x1,y1),B(x2,y2),C(x3,y3),顺次连接 A,B,C 组成三角形,AB 边和 AC 边的的向量分别为:

AB=(x2-x1,y2-y1) AC=(x3-x1,y3-y1)

则 AB 和 AC 的叉积为

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 |x2-x1, y2-y1| 
 |x3-x1, y3-y1|

值为:(x2-x1)*(y3-y1) - (y2-y1)*(x3-x1)

如果 AB*AC>0,则三角形ABC是逆时针的 如果 AB*AC<0,则三角形ABC是顺时针的

这样就可以算出来拖动的时候是逆时针还是顺时针,之后就可以争对性的做处理了。

Share

继续分享看《暗时间》中的一些感想。

在『逃出你的肖申克』一节中讲到人的一些天性和习惯,比如我们天性是目光短浅,只看到眼前利益,也许这在物质匮乏有上顿没下顿的远古社会是再正常不过的了;比如我们总说『说起来容易,做起来难』,习惯的力量远远大于我们想象,听到一番很有道理的话后,看似有些领悟,可能过几天不注意又故态复萌了。

这是由于很多天性是在远古社会选择适应的,并不适应短短几百年我们才迈入的现代社会。

就像学习一样,是个逆人性的过程。坚持做事情同样也是如此。

这个也和《人类简史》一书中说的暗暗相通,人们对糖分的追求是刻在骨子里的,远古社会资源匮乏,而糖分是主要的热量来源,所以数万年来人类祖先都在渴求糖分,这也传承在我们的基因里。 到了现代社会,资源已经极大的丰富,理论上来说不需要吃大量的糖分,但人们还是忍不住,因为这个不是由我们身体决定的,而是我们的天性,所以减肥很痛苦,也是一个逆人性的过程。

有时候从天性,从传承的角度来看我们自己的种种行为,会觉得特别有意思。


碎碎念

记录一些所思所想,写写科技与人文,写写生活状态,写写读书心得,主要是扯淡和感悟。 欢迎关注,交流。

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

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

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

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

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
​LeetCode刷题实战469:凸多边形
算法的重要性,我就不多说了吧,想去大厂,就必须要经过基础知识和业务逻辑面试+算法面试。所以,为了提高大家的算法能力,后续每天带大家做一道算法题,题目就从LeetCode上面选 !
程序员小猿
2021/12/17
4560
​LeetCode刷题实战469:凸多边形
计算几何笔记
若向量$(x, y)$旋转角度为$a$,则旋转后的向量为$(xcosa - ysina, y cosa + xsina)$
attack
2018/08/01
1.3K0
计算几何笔记
已知三点求平面法向量
空间已知三点的位置p1(x1,y1,z1),p2(x2,y2,z2),p3(x3,y3,z3),令它们逆时针在空间摆放。这样就可以得到平面的两个向量p1p2(x2-x1,y2-y1,z2-z1),p1p3(x3-x1,y3-y1,z3-z1),而平面法线总是和这两个向量垂直。也就是说,p1p2与p1p3的向量积就是平面的法向量n。
charlee44
2019/08/13
3.5K0
【改革春风吹满地 HDU - 2036 】【计算几何-----利用叉积计算多边形的面积】
我们都知道计算三角形的面积时可以用两个邻边对应向量积(叉积)的绝对值的一半表示,那么同样,对于多边形,我们可以以多边形上的一个点为源点,作过该点并且过多边形其他点中的某一个的多条射线,这样就可以把该多边形变为多个三角形,然后利用叉积求面积即可。 不过要注意,对于三角形可以简单的用叉积的绝对值的一半表示,但对于多边形不可随意将它分割成的几个三角形对应的叉积的绝对值相加,要有一定顺序才可。 对于三角形,有
_DIY
2019/09/11
6610
【改革春风吹满地 HDU - 2036 】【计算几何-----利用叉积计算多边形的面积】
atan和atan2反正切计算
返回值 若不出现错误,则返回 arg 在[−π/2;+π/2][−π/2;+π/2] [- π/2 ; +π/2] 弧度范围中的弧(反)正切( arctan(arg)arctan(arg)arctan(arg) )。值域有限,一四象限,斜率不存在不能求。 2. 使用反三角函数atan2求斜率,原型如下
Enterprise_
2019/03/01
1.6K0
【OpenGL】十三、OpenGL 绘制三角形 ( 绘制单个三角形 | 三角形绘制顺序 | 绘制多个三角形 )
三角形绘制即绘制一个面 , 三个点可以唯一确定一个面 , 四个点及多个点组成的多边形 , 不一定是一个面 ;
韩曙亮
2023/03/28
2.8K0
【OpenGL】十三、OpenGL 绘制三角形  ( 绘制单个三角形 | 三角形绘制顺序 | 绘制多个三角形 )
网页|HTML5 也可以画一画(canvas)
在日常生活中总喜欢涂涂画画写写,这样可以使表达更加直观,记录的也更加详细,而在HTML5中同样可以画一画。canvas意为画布,现实生活中用它来作画,在HTML5中的canvas与之类似,可以称它为“网页中的画布”,有了这个画布便可以轻松的在网页中绘制图形、文字、图片等。
算法与编程之美
2020/04/15
2.5K0
平面中判断点在三角形内算法(同向法)
平面中判断点在三角形内外有很多中算法,文献1中提到了一种同向法,我认为是比较好的解法,兼顾了效率和可理解性。不过这个算法有两个要注意的地方。
charlee44
2021/06/10
1.3K0
【CSS3】CSS3 2D 转换 - rotate 旋转 ② ( 使用 rotate 旋转绘制三角形 )
一、使用 rotate 旋转绘制三角形 ---- 使用 rotate 旋转绘制三角形 的原理 : 先绘制正方形 , 为该正方形设置边框 , 只设置 右侧 和 下方的 边框 , div { width: 40px; height: 40px; border-right: 2px solid black; border-bottom: 2px solid black; } 如果要一
韩曙亮
2023/04/24
4830
【CSS3】CSS3 2D 转换 - rotate 旋转 ② ( 使用 rotate 旋转绘制三角形 )
【CSS3】CSS3 2D 转换 - rotate 旋转 ③ ( 使用 transfrom-origin 设置旋转中心点 | 使用 方位词 / 百分比值 / 像素值 设置旋转中心点 )
为 div 盒子模型 设置 transform: rotate 样式 , 可以使 盒子模型 围绕 中心点 进行 旋转 , 代码如下 :
韩曙亮
2023/10/11
1.1K0
【CSS3】CSS3 2D 转换 - rotate 旋转 ③ ( 使用 transfrom-origin 设置旋转中心点 | 使用 方位词 / 百分比值 / 像素值 设置旋转中心点 )
【OpenGL】十四、OpenGL 绘制三角形 ( 绘制 GL_TRIANGLE_STRIP 三角形 | GL_TRIANGLE_STRIP 三角形绘制分析 )
该模式绘制首先在 glBegin 方法中设置 GL_TRIANGLE_STRIP 参数 , 然后在 glBegin 和 glEnd 之间设置多个点进行三角形绘制 ;
韩曙亮
2023/03/28
1.5K0
【OpenGL】十四、OpenGL 绘制三角形  ( 绘制 GL_TRIANGLE_STRIP 三角形 | GL_TRIANGLE_STRIP 三角形绘制分析 )
随手画个圆,你是怎么画的?我们分析了10万个圆,得到了这样的结论
大数据文摘作品 编译:Niki、吕征达、笪洁琼、Harry 在读本文之前,可以先自己试着从纸上画个圆圈。再回想一下,你是从上面开始画的还是下面呢?顺时针还是逆时针? 在这些问题里,可能隐藏着你来自哪里的线索。 今年十一月,谷歌发布了一款叫“Quick,Draw!”的线上游戏,玩家需要在20秒内画出要求的图案,比如骆驼或洗衣机之类的。(游戏界面传送门:https://quickdraw.withgoogle.com/) 这个游戏的目的远不止让你开心,真正的初衷是运用这些草图让计算机学习人如何绘画。(意味深长啊
大数据文摘
2018/05/24
1.2K0
多边形的点序
凸多边形:Convex polygon,non-self-intersecting polygon, simple polygon说的都是它(定义详见 wiki)。常见的凸多边形有:矩形、三角形等。
用户4363240
2020/01/01
1.7K0
多边形的点序
hover 背后的数学和图形学
前端开发中,hover是最常见的鼠标操作行为之一,用起来也很方便,CSS直接提供:hover伪类,js可以通过mouseover+mouseout事件模拟,甚至一些第三方库/框架直接提供了 hover API ,比如 jQuery 的 hover() 函数。大部分前端开发者在使用这些很方便的方法时,可能并没有思考过 hover 背后的实现原理。
寒月十八
2021/11/19
1.4K0
变换(Transform)(1)-向量、矩阵、坐标系与基本变换
如果要将右侧坐标系变为左侧那种,我们只需要做一些旋转操作,将右侧坐标系顺时针旋转180度,再将整个坐标系水平翻转即可。我们可以通过一定的旋转操作将两个坐标系重合,那么我们就称它们具有相同的旋向性(handedness)。
Zero Two
2024/07/21
4860
(hdu step 7.1.5)Maple trees(凸包的最小半径寻找掩护轮)
求凸包的最小覆盖圆的半径。事实上就是在求完凸包以后再求一下最小覆盖圆即可了。
全栈程序员站长
2022/01/11
3690
(hdu step 7.1.5)Maple trees(凸包的最小半径寻找掩护轮)
【怕啥弄啥系列】Canvas - 基础图形绘制
HTML5 <canvas> 元素用于图形的绘制,通过脚本 (通常是JavaScript)来完成.
神仙朱
2019/08/02
1.1K0
第4章-变换-4.1-基础变换
本节介绍最基本的变换,例如平移、旋转、缩放、剪切、变换级联、刚体变换、法线(normal)变换(不太normal)和逆计算。对于有经验的读者,它可以作为简单变换的参考手册,对于新手,它可以作为对该主题的介绍。这些材料是本章其余部分和本书其他章节的必要背景。我们从最简单的变换开始——平移。
charlee44
2021/12/21
4.1K0
第4章-变换-4.1-基础变换
使用 mesh 实现多边形裁剪图片!Cocos Creator!
mesh 是什么? mesh 是决定一个物体形状的东西。例如在二维中可以是正方形、圆形、三角形等;在三维中可以是正方体、球体、圆柱体等。
张晓衡
2020/02/20
2.2K0
Flash/Flex学习笔记(55):背面剔除与 3D 灯光
Animation in ActionScript3.0 这本书总算快学完了,今天继续:上一回Flash/Flex学习笔记(50):3D线条与填充 里,我们知道任何一个3D多面体上的某一个面,都可以分解为多个三角形的组合。比立方体为例,每个面都由二个三角形组成,但在那一篇的示例中明显有一个问题:不管立方体的某一个面是不是应该被人眼看见(比如转到背面的部分,应该是看不见的),这一面都被绘制出来了。 在这一篇的学习中,我将带大家一起学习如何将背面(即看不见的面)删除掉,即所谓的“背面剔除”。 先做一些预备知识的
菩提树下的杨过
2018/01/22
1.3K0
Flash/Flex学习笔记(55):背面剔除与 3D 灯光
推荐阅读
相关推荐
​LeetCode刷题实战469:凸多边形
更多 >
LV.1
腾讯高级UI工程师
加入讨论
的问答专区 >
    领券
    问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档