GIS的底图一直使用金字塔技术进行切图,使用户能够快速访问指定级别的地图或者影像。但是切图本身是一张图片,无法进行交互。于是又引入了矢量图层用来显示矢量点线面,这通常需要先获取矢量地理数据,然后通过前端将其绘制成不同元素便能通过鼠标进行响应交互了。
在腾讯地图上发一张自定义的手绘地图,由于手绘地图像素都比较高,加载一整张图速度极慢。将手绘地图按照地图的瓦片规则切片分开加载。
话说,以前的前端工程师在入行时都当过「切图仔」或「切图女」。曾经,「切图」作为前端一门基础且必备的技能,不知何时开始已经不再提起。很多面试官在招聘时都忽略了PS的存在,其实在国外一位优秀的前端工程师是包揽设计工作的,PS玩得可溜呢。
前几天发了“前端工程师都能做什么”这篇文章, 此文的末尾有这样一句话:“...毕竟,无限可能嘛...” 有同学留言给我, “可是新手往往望着无限可能而不知所措” 这句话我当时回复的是,“请先从切图开
工业缺陷检测是当前深度学习落地的热门项目,其中瓷砖生产过程中的“质量检测环节”需要检测出瓷砖表面的瑕疵,目前比较依赖于人工,效果和效率都层次不齐。
2个月前,写过一篇文章《从网易与淘宝的font-size思考前端设计稿与工作流》总结过一些移动web中有关手机适配的一些思路,当时也是因为工作的关系分析了下网易跟淘宝的移动页面,最后才有那篇文章的总结,可惜的是因为项目的关系,这两个月来几乎没有机会做移动类项目的工作,所以那些理论一直没有得到真正的实践。这次因为公司有一个app需要做一个推广的下载页面,虽然简单,但也值得一试那篇文章里提到的适配方法,所以本文的内容就是介绍该文中提到的淘宝的做法:《lib-flexible弹性布局方案》。(注:该文中提到的网易的做法跟淘宝的做法其实是大同小异,你访问http://3g.163.com/touch/看下页面源码顶部的JS就能明白了。相较于淘宝的做法,淘宝的方法更能称之为一个方案,网易的做法代码质量实在不敢恭维,所以从本文的角度,推荐淘宝的lib-flexible)
昨天咱们谈过了什么是切图,那今天接着往下说说,切图之后做什么。 一般来讲,切图的工作成本是HTML静态页面。在有些公司,是美工或是UI设计他们给切了。但这么多年来,这些美工和UI他们给切的图片,没有一次是好用的。我都得修补或是返工,差别只是程度不同。 为啥呢?因为他们不管前端开发。可能也基本不懂。所以UI和美工他们切图,那是真正的按图片的边啊,缝什么的往下切。 好了,在咱们前端开发的手里,切图这环节完事了之后。接下来你有二种情况, 第一,你们是用J2EE,或是.NET的开发环境,那么你需要把你的静态页面放到
WebGL 是 Web 3D 渲染引擎的基础,它作为非常底层的 API,学习上手难度非常大,这是因为 WebGL 要求的背景知识比较多。而网上的教程一般没有过多介绍直接就介绍 API 开始渲染了,容易让人云里雾里,很容易被劝退,就算学到了 API 使用,也是只懂表面知识,没有了解背后的原理,很容易就忘记了。
互联网的疯狂开展,让企业对开发人员的需求缺口越来越大,以至于呈现年薪40万前端职位,关键是:竟然仍是招不到人,够悲催的吧;而另一端,越来越多的人认识到这是一块大金矿,张狂地涌入互联网. 这其中,许多人将前端视作开启互联网作业的进口。在许多人眼里,前端就是切切图,很简略的,只需能够将视觉规划师的PS(photoshop)图转换成网页就能找到工作。而我,几年前不小心踏入互联网职业,也被许多人问及,前端开发简略吗?我能做前端吗? 面临这样的问题,还有许多问及前端问题的人,我真是不好说。今日自己拙见,给前端人员列一
摘要 如何成为一名优秀的切图工程师?百度资深研发工程师潘征与大家分享自己的工作心得。 ROLE移动端酷炫运营页 2014年开始,我在我们部门负责移动端酷炫运营页面,也就是俗称的H5的研发工作。 这些酷
前端开发状态为0,就是什么都没有,一切都是空白。极端点甚至连javascript是啥都不知道。只知道这二年前端开发很火,就跑来学前端。想培训个三个月半年的,出来就十几K,,,这样的想法,大有人在。 1是什么?100满分,只得1分,就这样。。。极端点,也许只知道javascript,就是1了;再知道了javascript和java的关系,就是雷锋和雷锋塔的关系,这就是2;再写出第一个alert("hello word"),这就是3.。。。就这样,一小步一小步的,最终成就了一大步。 许多同学纠结于什么时候算是学
欢迎访问源码: https://github.com/ZZES-ZCDC/questionnaire_manage_bd
image.png 这句标题直接读出来,可能100%的人都不会赞同。菜鸟就是菜鸟,读了100本JS或程序的书,他依然是菜鸟。但我并不这样理解,在我的脑子里,工作或职业是有不同的要求的,不同的职业,不同的级别,对于从业者的要求是不一样的。 只要你认真的在学JS或CSS,那么你必然会学到一些技能。那么这一点点的JS或CSS的技能,就能帮助你胜任相应级别的工作。例如,你学会了CSS,OK,那么你可以去做切图。在切图的工作过程中,你又学会了JS,然后你就可以去做JS的工作。虽然在此过程中,你依然会被人称之为菜鸟,但
接 [一对一讲什么] 之 切图之后做啥?要加入项目和测试接口 上回书说,切完了页面,把HTML文件啊,CSS,JS,IMG图片什么都扔到相应的开发环境目录里,把链接神码的都搞好,然后在开发环境里把你的页面能运行起来,就像这样, 你的自己电脑上搞好的页面的访问路径是这样的: file:///D:/wesay/3/html5_1.html 如果你自己在本地电脑搞个apache服务,那么这个页面的访问路径是这样的, localhost/wesay/3/html5_1.html 而如果你配置好开发环境之后,把项目跑
在很久很久以前的公元1993年,位于美国的伊利诺州诞生了一位名为NCSAMosaic的孩子。它便是传说中的微软IE、网景以及后续众多网页浏览器的鼻祖。可惜在当时只有少数的幸运儿才可以使用它。
到此,通过gatsby就快速的搭建了一个博客网站,我们只需书写markdown文件就能生成对应的网页了。至于网页美化,那是切图的事儿,我就不在这里墨迹了。
讲一下我对面试的一些。。。“偏见”,哈哈,熟悉我的同学们一定要批判的读接下来的内容哈。
话说,以前的前端工程师在入行时都当过切图仔或切图女。曾经,切图作为前端一门基础且必备的技能,不知何时开始已经不再提起。很多面试官在招聘时都忽略了PS的存在,其实在国外一位优秀的前端工程师是包揽设计工作的,PS玩得可溜呢。
怎样算是个体面的前端攻城狮? 大概是,PM,设计,开发等工种都觉得你很专业,很腻害吧~ 下面阐述下我心中体面攻城狮该具备的 软件 能熟练使用前端会用的软件。软件主要分为以下几类 IDE 我用的是Su
对于一些小的简单的动画,借助css、js差不多就能实现,而且还不能保证还原度百分百(还能接受);
前端是一个承上启下的职位,正因为其位置的特殊性导致其必须了解设计和后台的一些基本知识。本文并非教大家如何取代设计的工作,而是讲解前端如何更快更便捷的实现一些简单的设计任务,在没有设计师的情况下如何利用工具解决UI呈现的问题,让工作事半功倍。 Photoshop使用 大多数前端工程师都有过切图的经历,也就是将设计师制作的PSD等格式的图片按照需求切成项目需要的大小并实现页面的呈现,那么作为一名合格的前端工程师,我们有必要了解并熟练的掌握Photoshop的一些功能,下面介绍下几个实用的Photoshop
作者:汪娇娇 时间:2017年12月26日 对于一些小的简单的动画,借助css、js差不多就能实现,而且还不能保证还原度百分百(还能接受); 对于那些复杂的动画,就算css、js(或者用帧动画、属性动画、Gif、WebP等实现)勉强实现,先不说还原度了(肯定很差),实现动画的资源一般都比较大,或者Gif 那就更大还不高清,加载慢,消耗性能,还有可能内存泄漏,造成手机发烫,闪退等现象。既然问题这么多,难道不实现了?如果要实现的话我们应该怎么办? 这时候就要找别的办法了,就不卖关子了,给大家推荐一个很好用的动画
emmm,这位产品小兄弟,说好只加 3 个页面,最后硬是让产品加了 6 个页面,差点凑齐七个小矮人了,后面的 UI 稿就像这样(考虑到公司利益,本文采用网上案例作为参考):
上个月,百度飞桨团队开源了其最新SOTA通用检测模型——PP-YOLOE+,COCO数据集精度达54.7mAP,其l版本相比YOLOv7精度提升1.9%,V100端到端(包含前后处理)推理速度达42.2FPS,文章回顾请戳:
HTML 常见标签和属性 文档类型声明 转义字符 网页访问无障碍(只是了解) CSS 常用选择器 样式生效规则(浏览器的默认样式,选择器权重的计算,样式的继承综合作用的结果)。 常用样式 布局 盒模型 水平,垂直居中 布局技术 相对,绝对和固定定位 Float(不推荐。功能弱,还要去浮动) inline-block(兼容旧些的浏览器用) Flex (主流) Grid(和Flex配合,面向未来)(只是了解) 响应式 媒体查询 rem 的使用(配合 JS 动态设置根节点的字体大小更灵活)。 效果 过
最近在做一个开源GIS的demo的工作,工作中涉及到了地图瓦片,选取的开发环境是geoserver+openlayers,那么地图瓦片自然而然也就使用geowebcache,geowebcache就相当于是openlayer和geoserver之间的中介,首先,geowebcache会根据你的配置信息,把相应的地图图层切好图,存放在磁盘中,然后在使用openlayer加载地图服务的时候,把地图服务的地址指向geowebcache,geowebcache接收到这些请求后,会根据请求的位置和比例尺在切片目录中找到对应的瓦片,然后返回给你,省去了动态生成地图的过程,速度大幅度提高,而且由于请求的图片资源是事先生成好的,浏览器加载这些图片之后,下一次再去请求同样的图片,就会从浏览器的缓存中拉去,速度进一步提高!
性能黄金法则 只有10%-20%的最终用户响应时间花在接收请求的HTML文档上,剩下的80%-90%时间花在HTML文档所引用的所有组件(图片,script,css,flash等等)进行的HTTP请求上。 前言 有关前端性能优化的资料参考于《高性能网站建设》这本书,这一系列的文章可以看作是对这本书的阅读笔记。 改善响应时间的最简单途径就是减少组件的数量,并由此减少HTTP请求的数量。接下来将探讨几个技术实现。 1. 图片地图 图片地图允许你在一个图片上关联多个URL。目标URL的选择取决于用户单击了图片上的
需求:页面上加几个输入框,一个输入框填一个邮箱地址,用户提交后,给这个邮箱发个邮件。
微服务设计、前后端分离、高可用、易扩展、易维护、统一配置、令牌限流、服务熔断、链路追踪、docker容器部署、rancher容器管理、自动化运维
JOOX Music 是腾讯面向海外市场发布的音乐 App,目前在其发布的五个国家和地区均是排名第一的音乐服务应用。JOOX Music 从2014年发布至今,经历了大小数十个版本的迭代,功能不断的完善和丰富。而它的体积在 v3.5 版本时达到了有点惊人的 124MB!而东南亚是 JOOX Music 的主要发行地区,这里的网络环境相对较差,存在大量老旧的小容量 iOS 设备,而 App Store 的下载也不太稳定。因此,对 JOOX Music 的裁包大作战已势在必行。
前端与移动开发基础大纲所处阶段主要内容技术要点学习目标第一阶段: HTML5 + CSS3HTML51、 浏览器与浏览器内核2、语法及使用、3、 常用标签4. 语义化5、 表单元素6、 HTML 、7 新增标签可掌握的核心能力: 掌握 HTML5 常用标签; 掌握 CSS 语法及使用技巧; 掌握CSS3新增选择器; 掌握CSS3新增样式属性; 掌握 DIV+CSS 布局方式; 掌握常见网页布局技巧; 掌握企业级、电商级网页开发基本的流程、规范; 掌握语义化、模块化、兼容性的PC端网页开发; 掌握 Pho
问题:我怎么才能收到你们公众号平台的推送文章呢? 这里的“重构”指的是将设计图(比如PSD)转换为html + css + js。 用这个标题,是因为前一段时间组里有一个开放式讨论:怎样才算一个好重构? 其实,"好"与"坏"向来都是相对的,因为每个人眼中看待"好"与"坏"的标准不一样,不如从自身的角度考虑一下:如何做一个好重构? 先来看一个平时我们遇到的最多的两栏布局: 📷 基本的html代码: 来看具体的CSS代码实现(忽略margin): 📷 很明显在保持同样html结构的情况下,实现两栏布局可以有多种
在 Web 开发中,我们经常会用到 icon,icon 的使用经历了从图片到字体,再到 svg 的演变过程,也产生出相应的 icon 库,如雪碧图、Font Awesome、Iconfont 等等。
从我上大学开始正式认识前端这个岗位到现在已经整整过了六年,这六年于我而言就像是观赏了一场盛大的游园活动。无数各式各样的框架、模式、开发思路如同花车一般从眼前掠过又走远。留下了一地残乱的余烬和破碎的思考。
由于一直在搞后端开发,对于前端内容的掌握一直停留在css、jquery、js、html这类的基础应用上。 一下子接触到前端工程化、spa这类的东西,曲线有些陡峭,整个过程经历了诸多曲折。将收集到的知识总结一下,掺杂着一些个人的理解,不一定准确。 开始搭建之前,先要搞清楚一些概念。 一些知识点 1、前端工程化 记得在刚刚进入软件行业的时候,项目组中一般都会有美工这个角色,负责设计系统需要的各种图片、切图,设计系统整体的样式。上面的工作完成后就可以交给后台开发人员了,后者负责后台逻辑,从数据库中读取数据并
近期学习了一下大厂h5开发实战内容,并且参考实战手册做一些记录。大概包括以下几个方面内容:
优秀的WEB前端工程师具备编写任何一个互联网系统的前端页面、交互代码的能力。根据对100家互联网名企对Web开发工程师的招聘要求分析,企业要求主要有两部分,一个是核心要求,一个是辅助要求,核心要求包括:语言技术:JS基础和核心/HTML5/CSS3、框架技术:JQuery、AJAX、Bootstrap、AngularJS、通讯协议技术:HTTP协议、服务端开发技术、交互技术:UI交互设计、客户端技术:微信开发技术、html5、JS、SDK开发、Android、iOS、Web App开发技术。辅助要求有1-3年Web工作经验(近80%的企业)、学历及相关专业、文档规范写作能力、团队合作能力、责任心。
PhotoShop从CS版本演变到现在的CC版本,切图功能发生了比较大的变化,我们可以把PhotoShop CS版本时的切图功能称为传统切图,而从PhotoShop CC版本开始PS提出了精准切图。所谓传统切图就是切图人员基本上都是自己分割图层切图,传统切图又分为全手工切图和参考线切图;现在CC版本提出的精准切图,切图人员可以依赖计算机把图层对象精确的切割出来,这样切割出来的图层肯定比传统切图切出来的精准度高。另一方面,CC版本可通过脚本执行全自动切图,这样完全解放了切图人员的双手。
自从用单页应用(SPA)风靡以降,对于 web 前端项目来说 -- 无论是目前绝大多数的基于 webpack 的项目,还是既有的 grunt/gulp 项目来说,其基本开发流程大都如下:
CSS 提供了 3 种机制来设置盒子的摆放位置,分别是普通流(标准流)、浮动和定位,其中:
我们把时钟拨到 11 年前,2007 年,在第 34 届 SIGGRAPH 2007 数字图形学年会上,以色列的两位教授 Shai Avidan 和 Ariel Shamir 展示了一种新的缩放裁剪图像方法,他们称之为 Seam Carving for Content-Aware Image Resizing,也就是我们后来所说的“接缝剪裁”(Seam Carving)算法。
Figma 是一个基于浏览器的协作的UI设计工具,其以轻量、便捷、跨平台使用、协同便捷的特点,迅速吸引了广大UI/UX 设计师们的喜欢。但是设计师经常遇到反复切图、交付开发等问题,所以借此机会分享一篇关于 Figma 切图的必要知识点和交付经验。
设计师在将设计稿交付给前端工程师之前必定会用到切图功能,但有时生成的切图却不符合前端的要求,怎么办呢?
正值求职高峰期,现在就业形势较好和较差的行业分别是哪些?哪些地区用人需求大?又有哪些地方就业竞争激烈?这份报告快来了解一下!2018年IT行业薪资大揭秘: 程序员平均薪资1万5, 你拖后腿了吗? 从报
主讲人 | 哈利 百度高级研发工程师 量子位整理编辑 | 公众号 QbitAI 目前,各个企业行业在AI落地应用中,常常会遇到极小目标检测问题。在这些AI应用中,都需要在一个大图中精准识别出极小目标,其检测至关重要,也面临很多难点。 比如,检测框高宽比不固定,图片背景杂乱,数据源稀缺,检测框相比图片非常小,这些难点都会导致较高的漏检率。 10月21日,「EasyDL AI开发系列公开课」第一期直播中,百度高级工程师以真实的产业场景为例,深入解析了如何解决这些难点、有效提高极小目标检测的准确率,并手把手演示了
终于找到你,我梦寐以求的PS切图插件。曾几何时,设计师在完成设计稿之后高效的输出标注切图一直是设计师的噩梦。为什么这么说呢?开发要的那么多尺寸,我到底该怎么切图?iPhone的版本已经不少了,更别提安卓那一堆的尺寸,真是让人欲哭无泪!
上图中是App设计中底部导航栏,开发希望每一个图标都能显示成相同大小,为此设计师往往需要费很大的精力去调整切图。摹客新增自定切图尺寸功能可以帮助你快速完成此类工作。接下来就给大家介绍一下摹客的新功能 —— 如何利用摹客 PS 插件快速实现自定切图尺寸~
前端切图是前端工程师们还原设计稿的过程中必不可缺的一环。不过,切图工作究竟谁来做?这个问题我们在各大论坛也屡见不鲜:前端工程师认为设计师出了设计稿,那么相应的切图也应该一并交付;设计师则认为前端工程师给的要求太多太杂,不如他们自己动手来得专业。
当界面设计定稿之后,设计师需要对图标进行切片,提供给开发工程师。切图与标注是为了能够满足开发人员对于效果图的高度还原需求,直接影响到工程师对设计效果的还原度,并且也是设计师重要的输出物之一。合适、精准的切图可以最大限度地还原设计图,起到事半功倍的效果。
领取专属 10元无门槛券
手把手带您无忧上云