Add support for circle layer #30

src/components/icons/CircleIcon.jsx

@@ -0,0 +1,15 @@
+import React from 'react'
+import IconBase from 'react-icon-base'
+
+
+export default class FillIcon extends React.Component {
+  render() {
+    return (
+      <IconBase viewBox="0 0 20 20" {...this.props}>
+        <path transform="translate(2 2)" d="M7.5,0C11.6422,0,15,3.3578,15,7.5S11.6422,15,7.5,15 S0,11.6422,0,7.5S3.3578,0,7.5,0z M7.5,1.6666c-3.2217,0-5.8333,2.6117-5.8333,5.8334S4.2783,13.3334,7.5,13.3334 s5.8333-2.6117,5.8333-5.8334S10.7217,1.6666,7.5,1.6666z"></path>
+      </IconBase>
+    )
+  }
+}
+
+

src/components/icons/LayerIcon.jsx

@@ -4,6 +4,7 @@ import LineIcon from './LineIcon.jsx'
 import FillIcon from './FillIcon.jsx'
 import SymbolIcon from './SymbolIcon.jsx'
 import BackgroundIcon from './BackgroundIcon.jsx'
+import CircleIcon from './CircleIcon.jsx'
 
 class LayerIcon extends React.Component {
   static propTypes = {
@@ -19,6 +20,7 @@ class LayerIcon extends React.Component {
       case 'background': return <BackgroundIcon {...iconProps} />
       case 'line': return <LineIcon {...iconProps} />
       case 'symbol': return <SymbolIcon {...iconProps} />
+      case 'circle': return <CircleIcon {...iconProps} />
       default: return null
     }
   }

src/config/layout.json

@@ -124,6 +124,50 @@
         }
       ]
     },
+    "circle": {
+      "groups": [
+        {
+          "title": "Settings",
+          "type": "settings"
+        },
+        {
+          "title": "Source",
+          "type": "source"
+        },
+        {
+          "title": "Basic",
+          "type": "properties",
+          "fields": [
+            "circle-color",
+            "circle-opacity",
+            "circle-stroke-color",
+            "circle-stroke-opacity",
+            "circle-blur"
+          ]
+        },
+        {
+          "title": "Scale",
+          "type": "properties",
+          "fields": [
+            "circle-radius",
+            "circle-stroke-width",
+            "circle-pitch-scale"
+          ]
+        },
+        {
+          "title": "Position",
+          "type": "properties",
+          "fields": [
+            "circle-translate",
+            "circle-translate-anchor"
+          ]
+        },
+        {
+          "title": "JSON",
+          "type": "jsoneditor"
+        }
+      ]
+    },
     "symbol": {
       "groups": [
         {