diff --git a/src/geom/circle.js b/src/geom/circle.js new file mode 100644 index 0000000..e992f07 --- /dev/null +++ b/src/geom/circle.js @@ -0,0 +1,44 @@ +import React from 'react'; +import ol from 'openlayers'; +import OLComponent from '../ol-component'; + +export default class Circle extends OLComponent { + constructor(props) { + super(props); + this.geometry = new ol.geom.Circle(); + this.updateFromProps(props); + } + + updateFromProps(props) { + if (props.children.length == 1) { + // props.children[0] is the center + this.geometry.setCenterAndRadius(props.children[0], props.radius); + } else if (props.children.length > 1) { + // props.children is the center + this.geometry.setCenterAndRadius(props.children, props.radius); + } else { + this.geometry.setCenterAndRadius([0, 0], props.radius); + } + } + + componentDidMount() { + this.context.feature.setGeometry(this.geometry); + } + + componentWillReceiveProps(newProps) { + this.updateFromProps(newProps); + } + + componentWillUnmount() { + this.context.feature.setGeometry(undefined); + } +} + +Circle.propTypes = { + children: React.PropTypes.arrayOf(PropTypes.number).isRequired, + radius: React.PropTypes.number.isRequired +} + +Circle.contextTypes = { + feature: React.PropTypes.instanceOf(ol.Feature) +} diff --git a/src/geom/index.js b/src/geom/index.js index 1b9f5a6..b8dc210 100644 --- a/src/geom/index.js +++ b/src/geom/index.js @@ -1,3 +1,6 @@ +export {default as Circle} from './circle'; export {default as Polygon} from './polygon'; export {default as LineString} from './line-string'; export {default as RawGeometry} from './raw-geometry'; +export {default as Point} from './point'; +export {default as MultiPoint} from './multi-point'; diff --git a/src/geom/line-string.js b/src/geom/line-string.js index 73ecfdc..6e08d90 100644 --- a/src/geom/line-string.js +++ b/src/geom/line-string.js @@ -20,6 +20,10 @@ export default class LineString extends OLComponent { componentWillReceiveProps(newProps) { this.updateFromProps(newProps); } + + componentWillUnmount() { + this.context.feature.setGeometry(undefined); + } } LineString.propTypes = { diff --git a/src/geom/multi-point.js b/src/geom/multi-point.js new file mode 100644 index 0000000..6c988b8 --- /dev/null +++ b/src/geom/multi-point.js @@ -0,0 +1,37 @@ +import React from 'react'; +import ol from 'openlayers'; +import OLComponent from '../ol-component'; + +export default class MultiPoint extends OLComponent { + constructor(props) { + super(props); + this.geometry = new ol.geom.MultiPoint(); + this.updateFromProps(props); + } + + updateFromProps(props) { + this.geometry.setCoordinates(props.children); + } + + componentDidMount() { + this.context.feature.setGeometry(this.geometry); + } + + componentWillReceiveProps(newProps) { + this.updateFromProps(newProps); + } + + componentWillUnmount() { + this.context.feature.setGeometry(undefined); + } +} + +MultiPoint.propTypes = { + children: React.PropTypes.arrayOf( + React.PropTypes.arrayOf(React.PropTypes.number) + ).isRequired, +} + +MultiPoint.contextTypes = { + feature: React.PropTypes.instanceOf(ol.Feature) +} diff --git a/src/geom/point.js b/src/geom/point.js new file mode 100644 index 0000000..093118c --- /dev/null +++ b/src/geom/point.js @@ -0,0 +1,35 @@ +import React from 'react'; +import ol from 'openlayers'; +import OLComponent from '../ol-component'; + +export default class Point extends OLComponent { + constructor(props) { + super(props); + this.geometry = new ol.geom.Point(); + this.updateFromProps(props); + } + + updateFromProps(props) { + this.geometry.setCoordinates(props.children); + } + + componentDidMount() { + this.context.feature.setGeometry(this.geometry); + } + + componentWillReceiveProps(newProps) { + this.updateFromProps(newProps); + } + + componentWillUnmount() { + this.context.feature.setGeometry(undefined); + } +} + +Point.propTypes = { + children: React.PropTypes.arrayOf(React.PropTypes.number).isRequired +} + +Point.contextTypes = { + feature: React.PropTypes.instanceOf(ol.Feature) +} diff --git a/src/geom/polygon.js b/src/geom/polygon.js index ada66f6..eb8b987 100644 --- a/src/geom/polygon.js +++ b/src/geom/polygon.js @@ -21,8 +21,8 @@ export default class Polygon extends OLComponent { this.updateFromProps(newProps); } - render() { - return false; + componentWillUnmount() { + this.context.feature.setGeometry(undefined); } } diff --git a/src/map.js b/src/map.js index e2b6591..b1e960c 100644 --- a/src/map.js +++ b/src/map.js @@ -32,6 +32,12 @@ export default class Map extends React.Component { this.map.setTarget(undefined) } + focus () { + const viewport = this.map.getViewport() + viewport.tabIndex = 0 + viewport.focus() + } + getChildContext () { return { map: this.map @@ -51,10 +57,8 @@ export default class Map extends React.Component { ) } - focus () { - const viewport = this.map.getViewport() - viewport.tabIndex = 0 - viewport.focus() + updateSize () { + this.map.updateSize() } }