rename chapter title

api/all.json

@@ -5,7 +5,7 @@
       "path": "chapters/big-data.md"
     },
     {
-      "title": "书籍录入程序",
+      "title": "书籍录入移动应用：条形码扫描",
       "path": "chapters/bookshelf.md"
     },
     {
@@ -13,11 +13,11 @@
       "path": "chapters/brand.md"
     },
     {
-      "title": "Web文本编辑器",
+      "title": "微信文章编辑器",
       "path": "chapters/congee.md"
     },
     {
-      "title": "JavaScript打造Slide应用",
+      "title": "JavaScript制作Slide框架",
       "path": "chapters/echoesworks.md"
     },
     {
@@ -25,7 +25,7 @@
       "path": "chapters/eppsc.md"
     },
     {
-      "title": "Google Map与Solr实现多边形搜索",
+      "title": "Solr实现多边形地理搜索",
       "path": "chapters/google-map-solr.md"
     },
     {
@@ -33,11 +33,11 @@
       "path": "chapters/growth.md"
     },
     {
-      "title": "Ionic ElasticSearch打造O2O应用",
+      "title": "Ionic与ElasticSearch打造O2O应用",
       "path": "chapters/ionic-es.md"
     },
     {
-      "title": "一步步搭建JavaScript框架: Lettuce",
+      "title": "一步步搭建JavaScript框架",
       "path": "chapters/lettuce.md"
     },
     {
@@ -45,7 +45,7 @@
       "path": "chapters/luffa.md"
     },
     {
-      "title": "单页面移动应用",
+      "title": "基于Backbone的单页面移动应用",
       "path": "chapters/moqimobi.md"
     },
     {
@@ -53,11 +53,11 @@
       "path": "chapters/oculus-three.md"
     },
     {
-      "title": "制作照片地图",
+      "title": "手动制作照片地图",
       "path": "chapters/onmap.md"
     },
     {
-      "title": "D3.js 制作技能树",
+      "title": "D3.js打造技能树",
       "path": "chapters/sherlock.md"
     },
     {
@@ -65,11 +65,11 @@
       "path": "chapters/tech-stack.md"
     },
     {
-      "title": "文本转化为Logo",
+      "title": "文本转Logo",
       "path": "chapters/text2logo.md"
     },
     {
-      "title": "GEOJSON与ElasticSearch实现高级图形搜索",
+      "title": "GeoJSON与ElasticSearch实现高级图形搜索",
       "path": "chapters/vmap.md"
     }
   ],

chapters/bookshelf.md

@@ -1,5 +1,5 @@
-书籍录入程序
-======
+书籍录入移动应用：条形码扫描
+===
 
 概况
 ---
@@ -61,6 +61,7 @@ $scope.scan = function () {
 
 开始之前，我们需要添加Cordova的SQLite插件：
 
+
     cordova plugin add https://github.com/litehelpers/Cordova-sqlite-storage.git
 
 
@@ -124,5 +125,3 @@ function saveToDatabase(data, barcodeData) {
 	return self;
 })
 ```	
-
-###练习建议

chapters/congee.md

@@ -1,4 +1,4 @@
-Web文本编辑器
+微信文章编辑器
 =====
 
 概况

chapters/echoesworks.md

@@ -1,5 +1,5 @@
-JavaScript打造Slide应用
-===================
+JavaScript制作Slide框架
+===
 
 概况
 ---

chapters/eppsc.md

@@ -1,5 +1,5 @@
-编辑-发布-分离应用
-==========
+编辑-发布-分离的博客系统
+===
 
 概况
 ---

chapters/google-map-solr.md

@@ -1,4 +1,4 @@
-Google Map与Solr实现多边形搜索
+Solr实现多边形地理搜索
 ===
 
 概况

chapters/ionic-es.md

@@ -1,4 +1,4 @@
-Ionic ElasticSearch打造O2O应用
+Ionic与ElasticSearch打造O2O应用
 ===
 
 概况

chapters/lettuce.md

@@ -1,4 +1,4 @@
-一步步搭建JavaScript框架: Lettuce
+一步步搭建JavaScript框架
 ===
 
 概况

chapters/moqimobi.md

@@ -1,4 +1,4 @@
-单页面移动应用
+基于Backbone的单页面移动应用
 ===
 
 概况

chapters/onmap.md

@@ -1,4 +1,4 @@
-制作照片地图
+手动制作照片地图
 ===
 
 概况
@@ -6,7 +6,7 @@
 
 ### Background:把照片放在地图上
 
-我使用的Nokia Lumia 920没有一个好的照片应用
+我使用的Nokia Lumia 920没有一个好的照片应用,而我当时也没有钱换一个新手机
 
 ### Showcase
 

chapters/sherlock.md

@@ -1,5 +1,5 @@
-D3.js 制作技能树
-===========
+D3.js打造技能树
+===
 
 概况
 ---

chapters/text2logo.md

@@ -1,4 +1,4 @@
-文本转化为Logo
+文本转Logo
 ===
 
 概况

chapters/vmap.md

@@ -1,11 +1,9 @@
-GEOJSON与ElasticSearch实现高级图形搜索
+GeoJSON与ElasticSearch实现高级图形搜索
 ===
 
 概况
 ---
 
-### 背景
-
 ### Showcase
 
 在线Demo见： [http://vmap.phodal.com/](http://vmap.phodal.com/)

ideabook.md

@@ -363,8 +363,8 @@ var create_map = function(mapData){
 
 ###练习建议
 
-书籍录入程序
-======
+书籍录入移动应用：条形码扫描
+===
 
 概况
 ---
@@ -426,6 +426,7 @@ $scope.scan = function () {
 
 开始之前，我们需要添加Cordova的SQLite插件：
 
+
     cordova plugin add https://github.com/litehelpers/Cordova-sqlite-storage.git
 
 
@@ -490,8 +491,6 @@ function saveToDatabase(data, barcodeData) {
 })
 ```	
 
-###练习建议
-
 制作专属Badge
 ===
 
@@ -617,7 +616,7 @@ dwg.save()
 
 
 
-Web文本编辑器
+微信文章编辑器
 =====
 
 概况
@@ -884,8 +883,8 @@ parasView.on('changeColor', function(args) {
 ###练习建议
 
 
-JavaScript打造Slide应用
-===================
+JavaScript制作Slide框架
+===
 
 概况
 ---
@@ -1071,8 +1070,8 @@ localStorage.setItem('echoesworks', index);
 ### 练习建议
   
 
-编辑-发布-分离应用
-==========
+编辑-发布-分离的博客系统
+===
 
 概况
 ---
@@ -1356,7 +1355,7 @@ grunt.registerTask('dev', ['default', 'connect:server', 'watch:site']);
 
 用于开发阶段这样的代码就够了，这个和你使用WebPack + React 似乎相差不了多少。
 
-Google Map与Solr实现多边形搜索
+Solr实现多边形地理搜索
 ===
 
 概况
@@ -1602,7 +1601,7 @@ if(typeof module !== 'undefined' && module && module.exports){
 
 那么未来呢？你觉得会是怎样的？
 
-Ionic ElasticSearch打造O2O应用
+Ionic与ElasticSearch打造O2O应用
 ===
 
 概况
@@ -2249,7 +2248,7 @@ map.on('click', function(evt) {
 ![ElasticSearch Map](http://ideabook.phodal.com/images/elasticsearch_ionit_map.jpg)
     
 
-一步步搭建JavaScript框架: Lettuce
+一步步搭建JavaScript框架
 ===
 
 概况
@@ -2677,7 +2676,7 @@ function printNode(applyNode, originRootNodeHTML, patchIndex) {
 
 最后，我们似乎就可以生成相应的测试代码了。。。
 
-单页面移动应用
+基于Backbone的单页面移动应用
 ===
 
 概况
@@ -4171,7 +4170,7 @@ if (this.camera.position.y < -10) {
 ###练习建议
 
 
-制作照片地图
+手动制作照片地图
 ===
 
 概况
@@ -4179,7 +4178,7 @@ if (this.camera.position.y < -10) {
 
 ### Background:把照片放在地图上
 
-我使用的Nokia Lumia 920没有一个好的照片应用
+我使用的Nokia Lumia 920没有一个好的照片应用,而我当时也没有钱换一个新手机
 
 ### Showcase
 
@@ -4357,8 +4356,8 @@ jsonFile.close()
 
 
 
-D3.js 制作技能树
-===========
+D3.js打造技能树
+===
 
 概况
 ---
@@ -4631,7 +4630,7 @@ for (var quadrant in data) {
 ```
 
 
-文本转化为Logo
+文本转Logo
 ===
 
 概况
@@ -4726,14 +4725,12 @@ colors_length = ConfigColor.items('Color').__len__()
 
 最后我们就可以得到我们想要的图片了~~
 
-GEOJSON与ElasticSearch实现高级图形搜索
+GeoJSON与ElasticSearch实现高级图形搜索
 ===
 
 概况
 ---
 
-### 背景
-
 ### Showcase
 
 在线Demo见： [http://vmap.phodal.com/](http://vmap.phodal.com/)

index.html

@@ -94,7 +94,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#练习建议">练习建议</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#书籍录入程序">书籍录入程序</a><ul>
+<li><a href="#书籍录入移动应用条形码扫描">书籍录入移动应用：条形码扫描</a><ul>
 <li><a href="#概况-1">概况</a><ul>
 <li><a href="#背景-1">背景</a></li>
 <li><a href="#showcase-1">ShowCase</a></li>
@@ -103,7 +103,6 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#步骤-1">步骤</a><ul>
 <li><a href="#step-1-zxing扫描与douban-api">Step 1: ZXing扫描与Douban API</a></li>
 <li><a href="#step-2-存储数据库">Step 2: 存储数据库</a></li>
-<li><a href="#练习建议-1">练习建议</a></li>
 </ul></li>
 </ul></li>
 <li><a href="#制作专属badge">制作专属Badge</a><ul>
@@ -117,7 +116,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-2-高级badge">Step 2: 高级Badge</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#web文本编辑器">Web文本编辑器</a><ul>
+<li><a href="#微信文章编辑器">微信文章编辑器</a><ul>
 <li><a href="#概况-3">概况</a><ul>
 <li><a href="#背景-3">背景</a></li>
 <li><a href="#showcase-3">ShowCase</a></li>
@@ -128,10 +127,10 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-2-require.js模块化">Step 2: Require.js模块化</a></li>
 <li><a href="#step-3-初始化">Step 3: 初始化</a></li>
 <li><a href="#step-4-创建对应的view">Step 4: 创建对应的View</a></li>
-<li><a href="#练习建议-2">练习建议</a></li>
+<li><a href="#练习建议-1">练习建议</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#javascript打造slide应用">JavaScript打造Slide应用</a><ul>
+<li><a href="#javascript制作slide框架">JavaScript制作Slide框架</a><ul>
 <li><a href="#概况-4">概况</a><ul>
 <li><a href="#背景-4">背景</a></li>
 <li><a href="#showcase-4">Showcase</a></li>
@@ -144,10 +143,10 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-4-解析字幕">Step 4: 解析字幕</a></li>
 <li><a href="#step-5-进度条">Step 5: 进度条</a></li>
 <li><a href="#step-6-同步">Step 6: 同步</a></li>
-<li><a href="#练习建议-3">练习建议</a></li>
+<li><a href="#练习建议-2">练习建议</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#编辑-发布-分离应用">编辑-发布-分离应用</a><ul>
+<li><a href="#编辑-发布-分离的博客系统">编辑-发布-分离的博客系统</a><ul>
 <li><a href="#概况-5">概况</a><ul>
 <li><a href="#背景-编辑-发布-开发分离">背景: 编辑-发布-开发分离</a></li>
 <li><a href="#用户场景">用户场景</a></li>
@@ -157,7 +156,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-2-静态页面生成">Step 2: 静态页面生成</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#google-map与solr实现多边形搜索">Google Map与Solr实现多边形搜索</a><ul>
+<li><a href="#solr实现多边形地理搜索">Solr实现多边形地理搜索</a><ul>
 <li><a href="#概况-6">概况</a><ul>
 <li><a href="#背景-5">背景</a></li>
 <li><a href="#showcase-5">Showcase</a></li>
@@ -181,7 +180,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#未来">未来</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#ionic-elasticsearch打造o2o应用">Ionic ElasticSearch打造O2O应用</a><ul>
+<li><a href="#ionic与elasticsearch打造o2o应用">Ionic与ElasticSearch打造O2O应用</a><ul>
 <li><a href="#概况-8">概况</a><ul>
 <li><a href="#背景-7">背景</a></li>
 <li><a href="#showcase-7">Showcase</a></li>
@@ -197,7 +196,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-6-ionic-openlayer-地图显示">Step 6: Ionic OpenLayer 地图显示</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#一步步搭建javascript框架-lettuce">一步步搭建JavaScript框架: Lettuce</a><ul>
+<li><a href="#一步步搭建javascript框架">一步步搭建JavaScript框架</a><ul>
 <li><a href="#概况-9">概况</a><ul>
 <li><a href="#背景-8">背景</a></li>
 </ul></li>
@@ -207,7 +206,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-3-寻找所需要的函数">Step 3: 寻找所需要的函数</a></li>
 <li><a href="#step-4-整合">Step 4: 整合</a></li>
 <li><a href="#step-5-测试">Step 5: 测试</a></li>
-<li><a href="#练习建议-4">练习建议</a></li>
+<li><a href="#练习建议-3">练习建议</a></li>
 </ul></li>
 </ul></li>
 <li><a href="#基于virtual-dom的测试代码生成">基于Virtual DOM的测试代码生成</a><ul>
@@ -221,7 +220,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-2-标记dom变化">Step 2: 标记DOM变化</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#单页面移动应用">单页面移动应用</a><ul>
+<li><a href="#基于backbone的单页面移动应用">基于Backbone的单页面移动应用</a><ul>
 <li><a href="#概况-11">概况</a><ul>
 <li><a href="#背景-10">背景</a></li>
 <li><a href="#showcase-9">Showcase</a></li>
@@ -251,10 +250,10 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-3-node-oculus-websocket">Step 3: Node Oculus WebSocket</a></li>
 <li><a href="#step-4-oculus-effect-dk2-control">Step 4: Oculus Effect + DK2 Control</a></li>
 <li><a href="#step-5-three.js-keyhandler">Step 5: Three.js KeyHandler</a></li>
-<li><a href="#练习建议-5">练习建议</a></li>
+<li><a href="#练习建议-4">练习建议</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#制作照片地图">制作照片地图</a><ul>
+<li><a href="#手动制作照片地图">手动制作照片地图</a><ul>
 <li><a href="#概况-13">概况</a><ul>
 <li><a href="#background把照片放在地图上">Background:把照片放在地图上</a></li>
 <li><a href="#showcase-11">Showcase</a></li>
@@ -263,10 +262,10 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#步骤-13">步骤</a><ul>
 <li><a href="#step-1-解析读取照片信息">Step 1: 解析读取照片信息</a></li>
 <li><a href="#step-2-上传数据">Step 2: 上传数据</a></li>
-<li><a href="#练习建议-6">练习建议</a></li>
+<li><a href="#练习建议-5">练习建议</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#d3.js-制作技能树">D3.js 制作技能树</a><ul>
+<li><a href="#d3.js打造技能树">D3.js打造技能树</a><ul>
 <li><a href="#概况-14">概况</a><ul>
 <li><a href="#背景-12">背景</a></li>
 <li><a href="#showcase-12">Showcase</a></li>
@@ -288,7 +287,7 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-2-处理数据">Step 2: 处理数据</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#文本转化为logo">文本转化为Logo</a><ul>
+<li><a href="#文本转logo">文本转Logo</a><ul>
 <li><a href="#概况-16">概况</a><ul>
 <li><a href="#背景-14">背景</a></li>
 <li><a href="#showcase-14">ShowCase</a></li>
@@ -298,9 +297,8 @@ code > span.in { color: #60a0b0; font-weight: bold; font-style: italic; } /* Inf
 <li><a href="#step-1-python-文字转logo实战">Step 1: Python 文字转Logo实战</a></li>
 </ul></li>
 </ul></li>
-<li><a href="#geojson与elasticsearch实现高级图形搜索">GEOJSON与ElasticSearch实现高级图形搜索</a><ul>
+<li><a href="#geojson与elasticsearch实现高级图形搜索">GeoJSON与ElasticSearch实现高级图形搜索</a><ul>
 <li><a href="#概况-17">概况</a><ul>
-<li><a href="#背景-15">背景</a></li>
 <li><a href="#showcase-15">Showcase</a></li>
 <li><a href="#jquery-mustache-leaflet">jQuery + Mustache + Leaflet</a></li>
 </ul></li>
@@ -618,7 +616,7 @@ def get_geo(ip):
 <span class="op">};</span></code></pre></div>
 <p>我们可以看到比较麻烦的地方就是生成地图上的数量点，也就是create_map函数。</p>
 <h3 id="练习建议">练习建议</h3>
-<h1 id="书籍录入程序">书籍录入程序</h1>
+<h1 id="书籍录入移动应用条形码扫描">书籍录入移动应用：条形码扫描</h1>
 <h2 id="概况-1">概况</h2>
 <h3 id="背景-1">背景</h3>
 <p>这个项目的起源是我想录入我的书架上的书籍——当时，大概有近四百本左右。由于大部分的手机软件都是收费的，或封闭的，因此我便想着自己写一个app来完成书籍的录入。</p>
@@ -704,7 +702,6 @@ def get_geo(ip):
     <span class="op">};</span>
     <span class="cf">return</span> self<span class="op">;</span>
 <span class="op">}</span>)</code></pre></div>
-<h3 id="练习建议-1">练习建议</h3>
 <h1 id="制作专属badge">制作专属Badge</h1>
 <h2 id="概况-2">概况</h2>
 <h3 id="背景-2">背景</h3>
@@ -798,7 +795,7 @@ dwg.save()</code></pre></div>
 <figure>
 <img src="http://ideabook.phodal.com/images/finally-brand.jpg" alt="Finally" /><figcaption>Finally</figcaption>
 </figure>
-<h1 id="web文本编辑器">Web文本编辑器</h1>
+<h1 id="微信文章编辑器">微信文章编辑器</h1>
 <h2 id="概况-3">概况</h2>
 <h3 id="背景-3">背景</h3>
 <h3 id="showcase-3">ShowCase</h3>
@@ -997,8 +994,8 @@ dwg.save()</code></pre></div>
 <pre><code>parasView.on(&#39;changeColor&#39;, function(args) {
   parasView.findComponent(&#39;Grid&#39;).set(&#39;hrStyle.*.color&#39;, args.color);
 });</code></pre>
-<h3 id="练习建议-2">练习建议</h3>
-<h1 id="javascript打造slide应用">JavaScript打造Slide应用</h1>
+<h3 id="练习建议-1">练习建议</h3>
+<h1 id="javascript制作slide框架">JavaScript制作Slide框架</h1>
 <h2 id="概况-4">概况</h2>
 <h3 id="背景-4">背景</h3>
 <p>又开始造一个新的轮子了，不过这次的起因比较简单，是想重新发明一个更好的Slide框架 —— EchoesWorks。如名字所言，我所需要的是一个<code>回声</code>工坊，即将博客、Slide重新回放。</p>
@@ -1127,8 +1124,8 @@ dwg.save()</code></pre></div>
 <p>正常情况下，我们只用一个标签来展示我们的slide。当我们有另外一个标签的时候，我们就可以存储当前的slide。</p>
 <div class="sourceCode"><pre class="sourceCode javascript"><code class="sourceCode javascript"><span class="va">localStorage</span>.<span class="at">setItem</span>(<span class="st">&#39;echoesworks&#39;</span><span class="op">,</span> index)<span class="op">;</span></code></pre></div>
 <p>这样就可以实现，在一个页面到下一页时，另外一个标签也会跳到下一页。</p>
-<h3 id="练习建议-3">练习建议</h3>
-<h1 id="编辑-发布-分离应用">编辑-发布-分离应用</h1>
+<h3 id="练习建议-2">练习建议</h3>
+<h1 id="编辑-发布-分离的博客系统">编辑-发布-分离的博客系统</h1>
 <h2 id="概况-5">概况</h2>
 <h3 id="背景-编辑-发布-开发分离">背景: 编辑-发布-开发分离</h3>
 <p>在这种情形中，编辑能否完成工作就不依赖于网站——脱稿又少了 个借口。这时候网站出错的概率太小了——你不需要一个缓存服务器、HTTP服务器，由于没有动态生成的内容，你也不需要守护进程。这些内容都是静态文件，你可以将他们放在任何可以提供静态文件托管的地方——CloudFront、S3等等。或者你再相信自己的服务器，Nginx可是全球第二好（第一还没出现）的静态文件服务器。</p>
@@ -1340,7 +1337,7 @@ git push -q upstream HEAD:gh-pages</code></pre>
 <p>还需要做的一件事情就是：</p>
 <div class="sourceCode"><pre class="sourceCode javascript"><code class="sourceCode javascript"><span class="va">grunt</span>.<span class="at">registerTask</span>(<span class="st">&#39;dev&#39;</span><span class="op">,</span> [<span class="st">&#39;default&#39;</span><span class="op">,</span> <span class="st">&#39;connect:server&#39;</span><span class="op">,</span> <span class="st">&#39;watch:site&#39;</span>])<span class="op">;</span></code></pre></div>
 <p>用于开发阶段这样的代码就够了，这个和你使用WebPack + React 似乎相差不了多少。</p>
-<h1 id="google-map与solr实现多边形搜索">Google Map与Solr实现多边形搜索</h1>
+<h1 id="solr实现多边形地理搜索">Solr实现多边形地理搜索</h1>
 <h2 id="概况-6">概况</h2>
 <h3 id="背景-5">背景</h3>
 <h3 id="showcase-5">Showcase</h3>
@@ -1502,7 +1499,7 @@ if(isAndroid) {
 <h3 id="未来">未来</h3>
 <p>我就开始思索这个问题，未来的趋势是合并到一起，而这一个趋势在现在就已经是完成时了。</p>
 <p>那么未来呢？你觉得会是怎样的？</p>
-<h1 id="ionic-elasticsearch打造o2o应用">Ionic ElasticSearch打造O2O应用</h1>
+<h1 id="ionic与elasticsearch打造o2o应用">Ionic与ElasticSearch打造O2O应用</h1>
 <h2 id="概况-8">概况</h2>
 <h3 id="背景-7">背景</h3>
 <p>搜索引擎是个好东西，GIS也是个好东西。当前还有Django和Ionic。</p>
@@ -1984,7 +1981,7 @@ $cordovaGeolocation
 <figure>
 <img src="http://ideabook.phodal.com/images/elasticsearch_ionit_map.jpg" alt="ElasticSearch Map" /><figcaption>ElasticSearch Map</figcaption>
 </figure>
-<h1 id="一步步搭建javascript框架-lettuce">一步步搭建JavaScript框架: Lettuce</h1>
+<h1 id="一步步搭建javascript框架">一步步搭建JavaScript框架</h1>
 <h2 id="概况-9">概况</h2>
 <h3 id="背景-8">背景</h3>
 <p>从开始打算写一个MV*，到一个简单的demo，花了几天的时间，虽然很多代码都是复制/改造过来的，然而<strong>It Works</strong>(nginx的那句话会让人激动有木有)。现在他叫lettuce，代码 <a href="https://github.com/phodal/lettuce" class="uri">https://github.com/phodal/lettuce</a>，如果有兴趣可以加入我们。</p>
@@ -2139,7 +2136,7 @@ root.Lettuce = Lettuce;
 <h3 id="step-3-寻找所需要的函数">Step 3: 寻找所需要的函数</h3>
 <h3 id="step-4-整合">Step 4: 整合</h3>
 <h3 id="step-5-测试">Step 5: 测试</h3>
-<h3 id="练习建议-4">练习建议</h3>
+<h3 id="练习建议-3">练习建议</h3>
 <h1 id="基于virtual-dom的测试代码生成">基于Virtual DOM的测试代码生成</h1>
 <h2 id="概况-10">概况</h2>
 <h3 id="背景-9">背景</h3>
@@ -2293,7 +2290,7 @@ root.Lettuce = Lettuce;
 <span class="op">}</span></code></pre></div>
 <p>用Chrome的console来标记修改的部分，及添加的部分。</p>
 <p>最后，我们似乎就可以生成相应的测试代码了。。。</p>
-<h1 id="单页面移动应用">单页面移动应用</h1>
+<h1 id="基于backbone的单页面移动应用">基于Backbone的单页面移动应用</h1>
 <h2 id="概况-11">概况</h2>
 <h3 id="背景-10">背景</h3>
 <p>看到项目上的移动框架，网上寻找了一下，发现原来这些一开始都有。于是，找了个示例开始构建一个移动平台的CMS——<a href="http://cms.moqi.mobi">墨颀 CMS</a>，方便项目深入理解的同时，也可以自己维护一个CMS系统。</p>
@@ -3504,11 +3501,11 @@ yaw = (rotation about (Pitch • Raw • Z));”</code></pre>
     <span class="kw">this</span>.<span class="va">camera</span>.<span class="va">position</span>.<span class="at">y</span> <span class="op">=</span> <span class="op">-</span><span class="dv">10</span><span class="op">;</span>
 <span class="op">}</span></code></pre></div>
 <p>快接上你的HMD试试吧~~</p>
-<h3 id="练习建议-5">练习建议</h3>
-<h1 id="制作照片地图">制作照片地图</h1>
+<h3 id="练习建议-4">练习建议</h3>
+<h1 id="手动制作照片地图">手动制作照片地图</h1>
 <h2 id="概况-13">概况</h2>
 <h3 id="background把照片放在地图上">Background:把照片放在地图上</h3>
-<p>我使用的Nokia Lumia 920没有一个好的照片应用</p>
+<p>我使用的Nokia Lumia 920没有一个好的照片应用,而我当时也没有钱换一个新手机</p>
 <h3 id="showcase-11">Showcase</h3>
 <figure>
 <img src="http://ideabook.phodal.com/images/onmap-demo.jpg" alt="Phodal’s Image" /><figcaption>Phodal’s Image</figcaption>
@@ -3633,9 +3630,9 @@ jsonFile.writelines(<span class="st">&#39;]}</span><span class="ch">\n</span><sp
 jsonFile.close()</code></pre></div>
 <h3 id="step-2-上传数据">Step 2: 上传数据</h3>
 <p>注册CartoDB，然后上传数据。</p>
-<h3 id="练习建议-6">练习建议</h3>
+<h3 id="练习建议-5">练习建议</h3>
 <p>无</p>
-<h1 id="d3.js-制作技能树">D3.js 制作技能树</h1>
+<h1 id="d3.js打造技能树">D3.js打造技能树</h1>
 <h2 id="概况-14">概况</h2>
 <h3 id="背景-12">背景</h3>
 <p>在开始设计新的技能树——<a href="https://github.com/phodal/sherlock">Sherlock</a>的同时，结合一下原有的技能树，说说如何去设计，新的技能树还很丑。</p>
@@ -3831,7 +3828,7 @@ jsonFile.close()</code></pre></div>
     <span class="op">}</span>)<span class="op">;</span>
   <span class="op">}</span>)
 <span class="op">}</span></code></pre></div>
-<h1 id="文本转化为logo">文本转化为Logo</h1>
+<h1 id="文本转logo">文本转Logo</h1>
 <h2 id="概况-16">概况</h2>
 <h3 id="背景-14">背景</h3>
 <p>在设计技能树的时候需要做一些简单的Logo，方便我们来识别，这时候就想到了PIL。加上一些简单的圆角，以及特殊的字体，就可以构成一个简单的Logo。做成的图标看上去还不错:</p>
@@ -3896,9 +3893,8 @@ font_colors <span class="op">=</span> []
 
 colors_length <span class="op">=</span> ConfigColor.items(<span class="st">&#39;Color&#39;</span>).<span class="fu">__len__</span>()</code></pre></div>
 <p>最后我们就可以得到我们想要的图片了~~</p>
-<h1 id="geojson与elasticsearch实现高级图形搜索">GEOJSON与ElasticSearch实现高级图形搜索</h1>
+<h1 id="geojson与elasticsearch实现高级图形搜索">GeoJSON与ElasticSearch实现高级图形搜索</h1>
 <h2 id="概况-17">概况</h2>
-<h3 id="背景-15">背景</h3>
 <h3 id="showcase-15">Showcase</h3>
 <p>在线Demo见： <a href="http://vmap.phodal.com/" class="uri">http://vmap.phodal.com/</a></p>
 <p>或者你已经使用过了相应多的省市区与地图联动，但是这些联动往往是单向的、不可逆。并且这些数据往往都是在线使用的，不能离线使用。下图是一个结合百度地图的省市区与地图联动：</p>