kopia lustrzana https://github.com/OpenDroneMap/WebODM
added shapefile & geojson templaye layer support
saricicekibrahim
rodzic
3714f438b6
commit
80a9d819ef
|
|
@ -0,0 +1,103 @@
|
|||
import shp from 'shpjs';
|
||||
import Spinner from 'spin';
|
||||
|
||||
export function addTempLayer(file, rejected, _this) {
|
||||
//random color for each feature
|
||||
let getColor = (_geojson) => {
|
||||
return 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')';
|
||||
}
|
||||
|
||||
//notifications on top
|
||||
let writeMessage = (_err) => {
|
||||
_this.setState({ error: _err.message || JSON.stringify(_err) });
|
||||
spinner.stop();
|
||||
}
|
||||
|
||||
//show wait spinner
|
||||
var spinner = new Spinner({ color: '#fff', lines: 12 }).spin(_this.map._container);
|
||||
|
||||
if (typeof rejected !== 'undefined' && rejected.length > 0) {
|
||||
let err = {};
|
||||
if (rejected[0].size > _this.maxTempLayerSize) {
|
||||
err.message = "File is bigger than " + _this.maxTempLayerSize + " bytes";
|
||||
} else {
|
||||
err.message = "Data error";
|
||||
}
|
||||
writeMessage(err);
|
||||
} else {
|
||||
//get just the first file
|
||||
file = file[0];
|
||||
let reader = new FileReader();
|
||||
let isZipFile = file.name.slice(-3) === 'zip';
|
||||
if (isZipFile) {
|
||||
//zipped shapefile
|
||||
reader.onload = function () {
|
||||
if (reader.readyState != 2 || reader.error) {
|
||||
return;
|
||||
} else {
|
||||
if (isZipFile) {
|
||||
shp(reader.result).then(function (geojson) {
|
||||
addLayer(geojson);
|
||||
}).catch(function (err) {
|
||||
err.message = "Not a proper zipped shapefile!";
|
||||
writeMessage(err);
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
reader.readAsArrayBuffer(file);
|
||||
} else {
|
||||
//geojson file
|
||||
reader.onload = function () {
|
||||
try {
|
||||
let geojson = JSON.parse(reader.result);
|
||||
addLayer(geojson);
|
||||
} catch (err) {
|
||||
err.message = "Not a proper json file!";
|
||||
writeMessage(err);
|
||||
}
|
||||
}
|
||||
reader.readAsText(file);
|
||||
}
|
||||
}
|
||||
|
||||
let addLayer = (_geojson) => {
|
||||
let tempLayer =
|
||||
L.geoJson(_geojson, {
|
||||
style: function (feature) {
|
||||
return {
|
||||
opacity: 1,
|
||||
fillOpacity: 0.7,
|
||||
color: getColor()
|
||||
}
|
||||
},
|
||||
//for point layers
|
||||
pointToLayer: function (feature, latlng) {
|
||||
return L.circleMarker(latlng, {
|
||||
radius: 6,
|
||||
color: getColor(),
|
||||
opacity: 1,
|
||||
fillOpacity: 0.7
|
||||
});
|
||||
},
|
||||
//
|
||||
onEachFeature: function (feature, layer) {
|
||||
if (feature.properties) {
|
||||
if (feature.properties) {
|
||||
layer.bindPopup(Object.keys(feature.properties).map(function (k) {
|
||||
return k + ": " + feature.properties[k];
|
||||
}).join("<br />"), {
|
||||
maxHeight: 200
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
tempLayer.addTo(_this.map);
|
||||
//add layer to layer switcher with file name
|
||||
_this.autolayers.addOverlay(tempLayer, file.name);
|
||||
//zoom to all features
|
||||
_this.map.fitBounds(tempLayer.getBounds());
|
||||
spinner.stop();
|
||||
}
|
||||
}
|
||||
|
|
@ -12,10 +12,12 @@ import ErrorMessage from './ErrorMessage';
|
|||
import SwitchModeButton from './SwitchModeButton';
|
||||
import ShareButton from './ShareButton';
|
||||
import AssetDownloads from '../classes/AssetDownloads';
|
||||
import {addTempLayer} from '../classes/TemplateLayer';
|
||||
import PropTypes from 'prop-types';
|
||||
import PluginsAPI from '../classes/plugins/API';
|
||||
import Basemaps from '../classes/Basemaps';
|
||||
import update from 'immutability-helper';
|
||||
import Dropzone from 'react-dropzone';
|
||||
|
||||
class Map extends React.Component {
|
||||
static defaultProps = {
|
||||
|
|
@ -273,34 +275,44 @@ class Map extends React.Component {
|
|||
if (this.shareButton) this.shareButton.hidePopup();
|
||||
}
|
||||
|
||||
onDrop(file, reject, _this) {
|
||||
addTempLayer(file, reject, _this);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div style={{height: "100%"}} className="map">
|
||||
<ErrorMessage bind={[this, 'error']} />
|
||||
<Dropzone
|
||||
onDrop={(accepted, rejected) => { this.onDrop(accepted, rejected, this) }} disableClick={true}
|
||||
maxSize={this.maxTempLayerSize} multiple={false}
|
||||
>
|
||||
{({ getRootProps, getInputProps }) => (
|
||||
<div {...getRootProps()} style={{ height: "100%" }} className="map">
|
||||
<ErrorMessage bind={[this, 'error']} />
|
||||
|
||||
<div
|
||||
style={{height: "100%"}}
|
||||
ref={(domNode) => (this.container = domNode)}
|
||||
onMouseDown={this.handleMapMouseDown}
|
||||
>
|
||||
</div>
|
||||
|
||||
<div {...getInputProps()}
|
||||
style={{ height: "100%" }}
|
||||
ref={(domNode) => (this.container = domNode)}
|
||||
onMouseDown={this.handleMapMouseDown}
|
||||
>
|
||||
</div>
|
||||
|
||||
<div className="actionButtons">
|
||||
{this.state.pluginActionButtons.map((button, i) => <div key={i}>{button}</div>)}
|
||||
{(!this.props.public && this.state.singleTask !== null) ?
|
||||
<ShareButton
|
||||
ref={(ref) => { this.shareButton = ref; }}
|
||||
task={this.state.singleTask}
|
||||
linksTarget="map"
|
||||
/>
|
||||
: ""}
|
||||
<SwitchModeButton
|
||||
task={this.state.singleTask}
|
||||
type="mapToModel"
|
||||
public={this.props.public} />
|
||||
</div>
|
||||
</div>
|
||||
<div className="actionButtons">
|
||||
{this.state.pluginActionButtons.map((button, i) => <div key={i}>{button}</div>)}
|
||||
{(!this.props.public && this.state.singleTask !== null) ?
|
||||
<ShareButton
|
||||
ref={(ref) => { this.shareButton = ref; }}
|
||||
task={this.state.singleTask}
|
||||
linksTarget="map"
|
||||
/>
|
||||
: ""}
|
||||
<SwitchModeButton
|
||||
task={this.state.singleTask}
|
||||
type="mapToModel"
|
||||
public={this.props.public} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</Dropzone>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -51,12 +51,15 @@
|
|||
"raw-loader": "^0.5.1",
|
||||
"react": "^16.2.0",
|
||||
"react-dom": "^16.2.0",
|
||||
"react-dropzone": "^8.0.3",
|
||||
"react-router": "^4.1.1",
|
||||
"react-router-dom": "^4.1.1",
|
||||
"react-test-renderer": "^15.6.1",
|
||||
"regenerator-runtime": "^0.11.0",
|
||||
"sass-loader": "^7.0.3",
|
||||
"shpjs": "^3.4.2",
|
||||
"sinon": "^4.0.0",
|
||||
"spin": "0.0.1",
|
||||
"statuses": "^1.3.1",
|
||||
"style-loader": "^0.13.1",
|
||||
"tween.js": "^16.6.0",
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue