- 浏览: 273694 次
- 性别:
- 来自: 北京
最新评论
-
qihuayu2008:
大神可否提供下完整的demo?谢谢
支持无级缩放的360展示技术实现之七 -
3xxx:
http://blog.csdn.net/hotqin888/ ...
文档协作的几种实现方式 -
di1984HIT:
哈哈,学习了~~
坑爹的RockSaw和坑爹的windows7 -
chebin:
用上了,很赞!节省了不少时间。多谢分享!
java编写的两个modbus CRC16实现 -
di1984HIT:
哈哈~~~
坑爹的RockSaw和坑爹的windows7
文章列表
境外游导航App选择
世界那么大,没有App出门怎么办?在美东晃荡数月,总结了几种情况下使用App导航的体验。 希望后来者对这些坑有所准备。
方案一:开通国内运营商的国际漫游
我的手机iphone4s,尝试了联通的北美26元/天不限流量的服务,实际上是通过AT&T接入的3G。
优点:信号还不错,因为不需要换手机卡,基本上不用折腾可以平滑切换到国外用。
坑:google map居然无法用,查询网友的帖子,或者手机APN仍然墙内,国内无法连接的互联网服务,用他家的国际漫游,仍然无法连接。打客.服.电.话证实了这点。
解决办法:ios用户可以考虑用自带的地图服务勉强 ...
调试篇
在前面的准备工作完成之后,本章我们进入正题,利用前面搭建的环境,在Eclipse下运行Crypti的TestNet节点。
参考文档
主线任务按Crypti的这篇官方文档:
该篇文档分别介绍了在Mac、Windows、和linux下的安装步骤。我走的Mac小路。
Crypti的TestNet不涉及安全问题,所以不需要运行在SandBox的V8引擎下,如果是正式节点,只能运行在Linux下的SandBox中。
这篇文章有个最大的坑就是:
Nodejs (v0.12),并不是任何v0.12.xx都可以的,我试了三个版本,只有v0.12.10可以。
我使用了nvm管理多个no ...
环境篇
Crypti是运行在V8引擎中的NodeJS应用,提到NodeJS很多人就会推荐Sublime作为IDE,其实与Sublime风格类似,也很轻巧的Visual studio code也值得尝鲜。
但作为熟悉Eclipse环境的程序员,我想推荐的却是:Nodeclipse。
既然装个开源的插件就可以继续在熟悉的界面下干活,何必又那么费事去适应新的IDE呢!
本机环境
OSX 10.11.3
JDK1.8.0_66
Eclipse 4.5.2
安装Nodeclipse
安装Nodeclipse过程比较简单,到Eclipse的Help->Eclipse Market ...
为ExtJS的grid panel提供restful服务
ExtJS的grid panel集成了负责前端交互的分页、检索、排序。
用浏览器开发者工具查看,可以看到它提交给后台的restful形式:
page:1
start:0
limit:27
sort:[{"property":"id","direction":"DESC"}]
filter:[{"operator":"like","value":"111"," ...
定位
最近项目中需要实现一个轻量的内容发布。市面上常见的内容管理系统大多面面俱到,反而不适合作为一个内嵌的组件,整合到系统中作为一个子模块。
因此决定在现有系统框架下,自行实现一个轻量的内容管理。
...
原型组成及环境搭建
ExtJS是优秀的前端RIA组件,ExtJS5采用了MVVM模型,它在MVC的基础上引入ViewModel抽象, 实现了在View和Data之间的双向Bind,程序员不需要再关注界面field与数据的双向更新。 在MVVM模型之下,可以轻松实现对数据的CRUD,前端界面通过OOP机制实现最大程度的组件派生和复用。 对于一致性的操作方式,甚至可以对Controller逻辑大量复用,程序员只需要将关注点放在特殊界面逻辑。
美中不足的是:Sencha官方并没有提供一个可供java使用者快速搭建应用的服务端原型。 本例是从一个实际项目抽取的快速搭建ExtJ ...
Mac下安装Activiti6教程
Activiti最近推出了Activiti6,该版本提供了全新的AngularJS+Bootstrap为基础的UI。
新版本的重要改进这篇文章有所提及:
http://www.jorambarrez.be/blog/2015/12/23/activiti-6-0-0-beta2-released/
但是官网提供的文档仍然没有6. ...
用HTML5编写的Web页面在完成PC端的调试之后,在发布到移动设备之前,需要进行必要的兼容性调试。
Apple官方提供的利用Mac上Web Inspector+IOS上safari联合调试为开发者提供了便利的手段。
有点类似安卓的真机调试,即调试窗口运行在PC下,交互在移动终端进行。PC与移动终端以USB连接交换信息。
步骤如下:
启用Mac端safari的开发模式
在Mac下,进到safari->偏好设置->高级,勾选 在菜单栏显示”开发“菜单
启用ios上safari的Web检查器
在ios下,进到 设置->safari->高级 ...
支持无级缩放的360展示技术实现之七
- 博客分类:
- Web3D
实现热区编辑
在画面中定义热区,以显示图文信息或者增加链接,是图形展示常见而且实用的功能点。
本章节通过引入OpenSeadragonSelection插件,JQuery ballon插件,利用OpenSeadragon的事件机制实现热区编辑。
最终效果截图如下:
目标功能
点击热区编辑按钮切换到热区编辑状态,再点击该按钮退出编辑状态
点击图形区可创建新的热区,或者点击选中已有热区
对选中的热区可以进行拖拽方式的编辑,包括位置和大小的调整
对选中热区的属性编辑,包括:id、title、content等
通过下拉框选择id,切换到该热区所在的帧及局部视图,并选中该 ...
支持无级缩放的360展示技术实现之六
- 博客分类:
- Web3D
实现快照与回放
在360度浏览的过程中,允许用户对特定帧的局部进行快照,将快照增加到快照集合。
之后在快照集合点击小图,可迅速回放该快照。
两种布局
快照集合有两种布局效果,采用垂直布局的效果如下图:
采用水平布局的最终效果如下图:
快照集合插件
选用了JQuery lightSlider , 它使用 MIT License
lightSlider 的自动垂直布局不太灵,最好自行通过高度运算,强制指定其 item:item_cout,
为OpenSeadragon扩展以下方法:
onSnap:点击快照按钮的处理函数
loadSnap ...
支持无级缩放的360展示技术实现之五
- 博客分类:
- Web3D
将缓存进行到底
通过简单的改动,可以在加载不同的帧时,保持对切片的缓存。
即令上文中的这句始终有效:
var imageRecord = tiledImage._tileCache.getImageRecord(tile.url);
但仅看这个函数的实参我们就可以想到,这个缓存是针对不同url的切片的,而对于不同帧(page),是有一个更高层次的tiledImage实例与之对应的,要实现更快的执行性能,还需要对tiledImage进行缓存,否则每切换到不同的帧,重新加载和解析一遍page的定义,并运算对应的切片,也会导致大量多余的运算。
对tiledImage ...
支持无级缩放的360展示技术实现之四
- 博客分类:
- Web3D
改造OpenSeadragon用于360展示
本节主要介绍改造OpenSeadragon,使其适用于360度展示。
过去的一年,我曾经对360展示的插件进行选型,商用的插件,我认为目前最成熟的是:
http://www.ajax-zoom.com/examples/,我用它做了一个项目实施,虽然遇到一些官网例程之外的麻烦,
总的来说,只要官网例子已经有的,依葫芦画瓢就好。官网的例子已经比较丰富了,作者的售后也很给力。
而开源方面情况就比较让人灰心了,我甚至没有找到一款同时具备360度旋转和无级缩放的开源插件。
OpenSeadragon Sequence Mode
Ope ...
支持无级缩放的360展示技术实现之三
- 博客分类:
- Web3D
用OpenseaDragon实现无级缩放
上节提及金字塔切片的多种格式,本节我们将用其中的一种格式:deep-zoom格式+OpenseaDragon实现高分辨率栅格图像的无级缩放。
由于相关知识点的文章已经叙述得较充分了,因此本节的叙述方式主要是在它们之间客串,以期用最简洁的文字使读者获得一个完整的印象。
Deep-Zoom
Deep-Zoom是微软发展的一种大影像互联网浏览格式,官方的介绍在此:
https://msdn.microsoft.com/en-us/library/cc645050(VS.95).aspx
它作为给Silverlight 2.0增光添彩的功能出现, ...
支持无级缩放的360展示技术实现之二
- 博客分类:
- Web3D
展品影像的采集及加工
本节对展品影像的采集及加工做个简单介绍。
影像采集
影像拍摄和采集的原理图如下:
主要硬件组成包括:步进电机驱动的转台、单反相机、用于控制单反相机快门与转台联动的PC,同时接收从单 ...
支持无级缩放的360展示技术实现之一
- 博客分类:
- Web3D
两种技术路线
本节介绍展品360展示的两种技术路线,对比其特点。
一、定义即用途
本文所讲的360展示是指用于产品或商品展示的Web浏览方式,它不是以下技术:
360实景:例如谷歌街景,这种技术是观察点在固定点旋转 ...