Mapbox Studio 常见问题

发表于 & 归档在 地图, 翻译.

之前借助leaflet + qunee实现了地图拓扑图,同样使用leaflet的有个更专业的地图应用:Mapbox,可以定制出简单、专业、漂亮的地图,在传统地图服务商(Google,Nokia, Apple …)之外,有了更好的选择,Mapbox Studio是一款开源软件,使用了大量的web技术:Mapnik, node.js, backbone.js, leaflet, codemirror …… 其客户端本身就是一个webapp + Chrome,跨平台,有良好的交互体验,值得前端开发者学习和参考

mapbox studio中用到的web技术:Mapnik, node.js, backbone.js, leaflet, codemirror

HTML简单布局 – layout.border

发表于 & 归档在 HTML5, JavaScript.

经常用到上下左右,中间填充满这样的布局,在java swing中有BorderLayout,HTML中通常使用CSS来实现布局,但要实现border layout这样的效果有些麻烦,很多第三方实现,比如easyui, extjs,功能过于强大,我只是想要一个简单的布局而已,于是自己写了这段js,支持嵌套布局以及小功能,方便团队使用,项目地址:https://github.com/samsha/layout.border

border.layout.mix

伪3D机房以及热力图

发表于 & 归档在 拓扑图.

机房图分2D和3D,此外也有2.5D 方案,也称之为伪3D,在小型网游中比较常见,斜45度角,网格分布,运行起来比较轻量,电信机房也可以采用这种技术,通过矩阵变换,固定45度视角,选择合适的图标,可以做出不错的效果,节省3D 建模的时间,同时可以结合2D平面图,是一种不错的机房图展示方案,下面是 Qunee 实现的一些简单示例,并可以结合热力图绘制,用以反映机房的温度分布,详细示例代码可向 support#qunee.com 申请
伪3D机房热力图温度图