Removing layer dependency from geolayers and refactoring maps.

lib/pixi/maps/geographics.html

@@ -38,6 +38,10 @@
         tokio: { x: 35.696278, y: 139.731366 }
     }
 
+    window.apps = [
+
+    ]
+
     function createApp(view) {
         let app = new MapApp({
             view,
@@ -52,6 +56,7 @@
         const wikimedia = "../assets/maps/wikimedia-world-robinson/2000px-BlankMap-World.png"
 
 
+
         return new Promise((resolve, reject) => {
             setTimeout(() => {
                 reject("Creating app timed out.")
@@ -69,13 +74,12 @@
                     cover: false
                 })
 
-                console.log(wikimediaMap)
-
                 app.addMaps({
                     "osm": osmMap, "wiki": wikimediaMap
                 })
                 app.selectMap("osm")
                 app.setup().run()
+                window.apps.push(app)
                 resolve(app)
             }, { resolutionDependent: false })
 
@@ -127,7 +131,9 @@
 
             ; (function () {
                 createApp(geopoint_canvas).then(app => {
-                    let capitalLayer = new GeoLayer({ name: "Capital Overlay" })
+
+                    let capitalContainer = new PIXI.Container()
+                    let capitalLayer = new GeoLayer(capitalContainer)
                     for (key in capitals) {
                         let capitalPoint = new GeoPoint(capitals[key], {
 
@@ -145,18 +151,20 @@
                                 this.graphics.endFill()
                             }
                         })
-                        capitalLayer.place(capitalPoint)
+                        capitalContainer.addChild(capitalPoint)
                     }
 
                     enableSwitch(geopoint_switch, app)
 
-                    app.mapLayer.place(capitalLayer)
+                    // app.mapLayer.place(capitalLayer)
+
+                    app.mapLayer.addLayer(capitalLayer)
                 }).catch(console.error)
             })()
 
         </script>
     </section>
-    <section id="geoline">
+    <!-- <section id="geoline">
         <h2>GeoLine</h2>
         <p>Geo line is a set of points, that are rendered as a line and can be updated individually.</p>
         <canvas id="geoline_canvas"></canvas>
@@ -281,7 +289,7 @@
                 })()
 
         </script>
-    </section>
+    </section>-->
 </body>
 
-</html>
+</html>