boundlessgeo/spatialconnect-js

Name: spatialconnect-js

Owner: Boundless

Description: Javascript library for the Spatial Connect mobile library

Created: 2015-08-26 17:41:37.0

Updated: 2017-06-20 12:09:13.0

Pushed: 2018-01-24 02:26:00.0

Homepage: null

Size: 110

Language: JavaScript

GitHub Committers

User	Most Recent Commit	# Commits

Other Committers

User	Email	Most Recent Commit	# Commits

README

SpatialConnect Javascript Library for Android & iOS

Version 0.10.0

Philosophy

The SpatialConnect javascript bridge is a cross platform solution for letting webviews access native functionality. This has a number of benefits pertaining to performance, security, and persistence to name a few. The request/response pattern is similar to the one way data flow paradigm found in the Flux architecture. A request occurs by calling an action in the library, and then all subscribers to the response observable will receive the result. The subscribers can use RxJS Observable instance methods to filter and operate on events that are emitted. We use the term spatial to refer to data with a finite number of dimensions. We use the term geospatial to refer to data with a finite number of dimensions where one of those dimensions have geographic coordinates.

Getting Started

Pull down dependencies

install

Run Tests

run test

Build distribution file

run build

Installation in your project

install spatialconnect

Usage in your project

In WebView

rt * as sc from 'spatialconnect';

In React Native

rt * as sc from 'spatialconnect/native';

Communicating with the Bridge

For iOS, JSON objects are sent to the SpatialConnect native library, and for Android, JSON is stringified and sent to the SpatialConnect native library. This is automatically detected in the library by using the user agent for each platform. The envelope for each message is as follows:

ction":<integer>,
ayload":<JSON Object>

Available Actions

SERVICE_ACTIVESTORESLIST = 100
SERVICE_ACTIVESTOREBYID = 101
SERVICE_SPATIALQUERY = 110
SERVICE_SPATIALQUERYALL = 111
SERVICE_GEOSPATIALQUERY = 112
SERVICE_GEOSPATIALQUERYALL = 113
SERVICE_CREATEFEATURE = 114
SERVICE_UPDATEFEATURE = 115
SERVICE_DELETEFEATURE = 116
SERVICE_FORMSLIST = 117
ORSERVICE_GPS = 200

These integer codes are bidirectional and are the same across platforms.

SpatialData Transmission

For sending and receiving geospatial data, the transmission format is using GeoJSON. You can encode geographic features like so:

gj = {
ype": "Feature",
roperties": {
"foo": "bar"

eometry": {
"type": "Point",
"coordinates": [ 10, 20 ]


store_name = 'a5d93796-5026-46f7-a2ff-e5dec85heh6b';
layer_name = 'point_features';
feature = sc.geometry(store_name, layer_name, gj);
reateFeature(feature).subscribe(function(f) {
add feature to OpenLayers map
r gj = (new ol.format.GeoJSON()).readFeature(f);
ctorSource.addFeature(gj);

You can also create non geographic features (spatial).

properties = { foo: "bar" };
feature = sc.spatialFeature(store_name, layer_name, properties);

Querying Data

Getting the current viewport from OpenLayers

extent = map.getView().calculateExtent(map.getSize());
filter = sc.Filter().geoBBOXContains(extent);
eospatialQuery(filter);

storeId = 'a5fdreg22';
filter = { $gte : 5 };
patialQuery(filter,storeId); //For one Store
patialQuery(filter); //For all stores

The data responds on the query observable. All components (listview,map) wanting the data can subscribe to that observable

that = this;
patialQuery().subscribe(
ata) => {
var gj = (new ol.format.GeoJSON()).readFeature(data);
vectorSource.addFeature(gj);

rr) => {
this.setState({
  error : err
});

 => {
this.setState({
  error : {}
});

Data Store Info

Get all stores

tores().subscribe(
toresArray) => {
setState({stores:storesArray});

avascript
storeId = 'afdse4';
tore(storeId).filter((s) => return s.storeId === storeId;)subscribe(
tore) => {
setState({storeInfo:store});

Location Services

Location Services

astKnownLocation().subscribe(
oc) => { console.log(loc); }

nableGPS();//Enables GPS
isableGPS();//Disable GPS

Custom Actions

You can send arbitrary messages to the native bridge like so:

ction.sendMessage(998,payload);