A new version of the point cloud viewer is integrated now in Street Smart. Below is a list of functions that work differently in the new point cloud viewer. A number of functions have also been added to the point cloud viewer.

New interface functions of the Point cloud viewer:

• getBackgroundPreset()
• getMinHeightColorization()
• getMaxHeightColorization()
• setBackgroundPreset(Background)
• setMinHeightColorization(HeightColorization)
• setMaxHeightColorization(HeightColorization)

These functions are not yet implemented in the new point cloud viewer:

• getCameraPosition()
• rotateDown(deg)
• rotateLeft(deg)
• rotateRight(deg)
• rotateUp(deg)
• lookAtCoordinate(lookAt)
• flyTo(position, lookAt?)

These functions work differently now:

• getPointBudget() The name of this function has been changed. The new name is: getPointAmount(). The return values have also been changed. The new return values are: 'low', 'medium' or 'high' or 'ultra'
• getPointSize()The return values have been changed. The new return values are: 'single', 'double' or 'large'
• getPointStyle() The return values have been changed. The new return values are: 'RGB', 'Height', 'Intensity'
• setPointBudget(budget) The name of this function has been changed. The new name is: setPointAmount(amount). The values that can be used have been changed. The new values are: 'low', 'medium' or 'high' or 'ultra'
• setPointSize(size) The values that can be used have been changed. The new values are: 'single', 'double' or 'large'
• setPointStyle(style) The values that can be used have been changed. The new values are: 'RGB', 'Height', 'Intensity', 'Classification' (for aerial only)

The use of these functions has not changed:

• TogglePointCloudType(value?)
• getButtonEnabled(buttonId)
• getEdgesVisibility()
• getId()
• getNavbarExpanded()
• getNavbarVisible()
• getType()
• toggleButtonEnabled(buttonId, enabled?)
• toggleEdges(visibility?)
• toggleNavbarExpanded(value?)
• toggleNavbarVisible(visible?)

Version 19.19

• Updated to React 16.12.0
• Please update your versions of React and React-DOM to version 16.12.0. Reason is that we also want to be prepared for React 17 next year.

Version 18.10

• Updated to React 16.4.1
• Please update your versions of React and React-DOM to version 16.4.1. Reason is that we also want to be prepared for React 17 next year.

Version 18.4

• The StreetSmartApi.open function takes a different options object, from now it can contain: panoramaviewer options and obliqueviewer options
• Previously accepted options.closable, options.maximizable and options.replace can be provided per viewer options

Version 17.3

• Removed previously deprecated functions addPanoramaViewer and destroyPanoramaViewer. Please use StreetSmartApi.open.
• addOverlay function distinct parameters changed to a single options object.

new options object

const query = 'Van Voordenpark 1, Zaltbommel';

const options = {
     viewerType: [StreetSmartApi.ViewerType.PANORAMA, StreetSmartApi.ViewerType.OBLIQUE],
     srs: 'EPSG:28992',
     panoramaViewer: {
         closable: true,
         maximizable: true,
         replace: true,
         recordingsVisible: true,
         navbarVisible: true,
         timeTravelVisible : true,
         measureTypeButtonVisible: true,
         measureTypeButtonStart: true,
         measureTypeButtonToggle: true,
     },
     obliqueViewer: {
         closable: true,
         maximizable: true,
         navbarVisible: true,
         timeTravelVisible : true,
     }
};

// Open
StreetSmartApi.open(query, options).then( successCallback, errorCallback);

Street Smart - Version 21.3

Story

• API: added the function to set an elevationLevel in the panorama viewer

Street Smart - Version 20.12

Story

• API: added pointcloud viewer documentation
• API: added aerial pointcloud toggle

Street Smart - Version 20.1

Story

• API: added pointcloud viewer to api
• API: added pointcloud viewer navigation functions
• API: added pointcloud viewer specific functions

Street Smart - Version 19.19

Story

• API: added measureMethod to startMeasurement

Street Smart - Version 19.18

Story

• API: Unit preference setting

Street Smart - Version 19.17

Bug

• Older oblique image not loaded on panning
• Symbol sizes in feet systems
• Flex direction for dashboard panel

Story

• Update error message
• API: panorama toggle sidebar expanded error
• Improve feedback for buttons
• API: disable pointcloud viewer

Street Smart - Version 19.16

Bug

• API: cant select redlining features
• Nested "And" filters in sld are not working
• Ownership of loading process
• Point measurements not shown in oblique
• Unnecessary Crowd Smart calls generated by API
• API: Non Street Smart point measurement + Forward Intersection
• New navigation with historic cyclorama's
• API: Oblique viewer crashes when a WFS layer is added.
• Panorama arrow key navagation
• Tooltip Crowd Smart missing for PanoramaViewer
• API: panorama save image wrong width/height
• API: geojson polygon measurement in api
• Brightness and Contrast not on measurements

Story

• Implement new slope stdev calculations + new correlation function
• Separate focus styling from hover/active

Street Smart - Version 19.15

Bug

• API: Close measurement by cross leads to exception in console log
• API: The cyclorama can be closed during the measurement
• API: Close measurement leads to an undefined removed viewer event
• Proper SRS' are not always loaded when needed
• Intersection calcualtions fail if recordedAt is not a date
• The lines of measurements are much too thick
• Correct equations for calculation of standard deviations of polygon measurements
• Small update of the standard deviation line calculations (change correlation parameters)

Story

• Support Line width PanoramaViewer
• Add pointcloud viewer
• Add pointcloud interface functions
• Improve layer styling in wizard
• Improve sizing of points/labels/symbols
• Label size Panoramaviewer
• Update npm openlayers to npm ol

Street Smart - Version 19.14

Bug

• SLD size in panorama works weird
• Perfect Polygon does not draw in API
• API: PropertyIsNull filter not working in Cyclorama
• Styling issue with polygon fill
• Webapp crashes in us give german error
• Fix crash forward intersection with polygons

Story

• Keyboard shortcuts
• Add extra panorama window color
• Remove Reactcss from project
• Remove / reduce usate of IntlComponents
• Update to latest pep.js / remove forked pep.js
• Standard deviation measurements

Street Smart - Version 19.13

Story

• Copy ground coordinates from cyclorama
• Show slope angle also with more than 45
• Remove link for full image when image is new tiling

Street Smart - Version 19.12

Bug

• Remove adress layer from non-NL configs
• 'Kadastrale kaart' not shown in oblique viewer
• Brightness and contrast no longer work in oblique
• Improve readability of measurement information popups
• Some 3D polygons not visible in panoramaviewer

Story

• Transparency slider on oblique
• View radius
• Rotating cyclorama by dragging viewing cone in oblique window
• Show a north arrow for the images
• Keep bright and contrast setting when opening another cyclorama
• DCR10 new Tiling Smart Click fix
• Implement React error bounds

Street Smart - Version 19.11

Bug

• Clicking non-lidar recording
• Pip images broken in panoramaviewer
• Viewing cone not visible
• Oblique measurement crashes when skipping the last observation

Story

• API: start oblique measurement

Street Smart - Version 19.10

Bug

• ObliqueHeight: height of WFS layer in oblique doesn't work
• ObliqueHeight: viewing cone doesn't work well (only one direction is working)
• Line does not look accurate in Cycloramaviewer
• Missing tooltip
• Surface cursor position not properly updated
• Layers are not showing in layer manager

Story

• Source image download
• Measurement panel collapse
• Make measurement properties panel collapsible
• Show total length of the line in the Cyclorama
• Show the area of a polygon in the cyclorama
• Measurement panel collapse

Street Smart - Version 19.9

Story

• Moving the measurement panel to the right side of the Cyclorama/Oblique
• Combine measurement list with measurement panel
• API - zoom window button turned off by default.

Street Smart - Version 19.8

Bug

• Measurement only appears after moving the mouse

Story

• Improve hitbox for addresslabels and other 2DText
• Rework loading indicator

Street Smart - Version 19.7

Bug

• Forward intersection: a click on a recording point leads to the addition of an observation point
• IE: oblique rotate buttons dont work
• API: toggleRecordingsVisibility is broken

Story

• API: Add an interface function to deselect a feature in a layer

Street Smart - Version 19.6

Bug

• API: viewer is not properly cleaned on destroy
• Forward intersection + insert between
• Oblique turn left button doesn't work.
• toggleAddressesVisible fails
• API: open 2 images, start measurement, close measurement, some functionality 2nd image doesn't work
• Fix SetState warnings
• Can't add observation to smart click measurement.

Story

• Add WFS overlay option to API
• "Merge" recordingslayer and historical recordings layer
• One single Cyclorama layer
• Change fillColor opacity for polygon measurements
• Improve forward intersection measurement calculations
• addLayer reducer throwing warnings

Street Smart - Version 19.5

Bug

• Standard deviation is lower than recording with point measurement
• API: Measuring in degree systems should not be possible
• Switching measurement type crashes Street Smart
• Black square for text lables
• Map point measurements broken.

Story

• Add WFS option on API-SLD-string with WFS-url
• Three.js replace point geometry with sprite
• Address number click leads to panorama update
• Oblique - feature zoomLvl
• Default collapsed/expanded MeasurementInformationPanel

Street Smart - Version 19.4

Bug

• API: after start-stop measurement, and two panoramic images are open, no events are fired from one of the images
• GeoJSON positioning in Oblique improved
• Color of lines in panorama defaults to white sometimes
• Fixed Css scoped outside of cmt

Story

• API: click-info not collapsable
• SLD: Expands external Graphic so that it is also possible to provide inline Content. (base64 string)
• Adjusted default measurement name

Street Smart - Version 19.3

Bug

• Click on point features in panorama is not working
• Custom layer styling for lines
• TypeError when toggling overlay in Oblique

Story

• Add WFS option on API-WFS-SLD-string styling
• API: Add address layer
• API: addOverlay function, Make it possible to also give a color to the layer

Street Smart - Version 19.2

Bug

• Decimal notation depending on language
• Textsymbolizer is not shown using SLD with SHP
• API: cant select redlining features
• Attribute window width for very long values

Street Smart - Version 19.1

Bug

• Panoramaviewer tooptip doesn't disapear
• Remove surfacecursor on mouseOut
• object information not correct with SHP overlay in cyclorama
• Height measurement, remove insert above button
• No oblique found form panorama
• double click zoom bug
• removeOverlay fails on oblique viewer
• Precision values change when adding point to line measurement
• Textlabels are not visible in the panorama viewer
• Safari Mac PanoramaViewer dragging (viewing) not working

Story

• Use Properties in CSSParameters in sld
• keep green color with height measurement
• API: Remove text: "No Windows Present"

Street Smart - Version 18.15.1

Bug

• API: rerender on parent div resize

Street Smart - Version 18.15

Bug

• navigateToUrl on line features
• Api: Measurement panel falls outside api window
• Measurement modal resize observer

Story

• API: Add SLD filter rule PropertyIsNull
• API: Responsive measurement selection
• API: update french language file

Street Smart - Version 18.14

Bug

• Zoom by mouse click problem on measurements
• First observation line not visible Forward Intersection
• Report blurring for France
• Missing language string MeasurementInformationPanel

Story

• Create measurement from WFS-geometry
• Download image

Street Smart - Version 18.13.1

Bug

• Window navigation bar gone when in measurementmode

Street Smart - Version 18.13

Bug

• Incorrect height in measurement US-feet
• getApiReadyState() returned incorrect value

Story

• Mosaic: ability to drag and resize windows

Below is a small example to get you started. For a more in depth example, go to : https://www.cyclomedia.com/en/service-and-support-for-developers/codeexamples

<script type="text/javascript" src="https://unpkg.com/react@16.4.1/umd/react.production.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/react-dom@16.4.1/umd/react-dom.production.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/openlayers/4.3.3/ol.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.10/lodash.min.js"></script>
<script src="https://streetsmart.cyclomedia.com/api/v19.5/StreetSmartApi.js"></script>
<script>
   // Here you can now call StreetSmartApi.init(), StreetSmartApi.open(),
   // or use event contents like this: StreetSmartApi.Events.panoramaViewer.RECORDING_LOADED
</script>

Some customers of CycloMedia have the imagery that they bought hosted on an internal website. For this reason the API can connect to this local imagery. For more information, go to : http://localinstallation.cyclomedia.com There you can also find information about how to simulate a local installation for development purposes.

PointcloudViewer component. Do not create this component directly; use the open function.

ObliqueViewer component. Do not create this component directly; use the open function.

StreetSmartApi.open('Van Voordenpark 1, Zaltbommel', {
viewerType: [StreetSmartApi.ViewerType.OBLIQUE],
srs: 'EPSG:28992',
}).then(
  function(result) {
    console.log(StreetSmartApi.getViewers()[0].getId());
});

PanoramaViewer component. Do not create this component directly; use the open function.

StreetSmartApi.open('5D4KX5SM', {
viewerType: [StreetSmartApi.ViewerType.PANORAMA],
srs: 'EPSG:28992',
panoramaViewer: { replace: false, },
}).then(
  function(result) {
    console.log(StreetSmartApi.getViewers()[0].getId());
});

// Having StreetSmartApi intialized:
let viewer = streetSmartApi.addPanoramaViewer(viewerDomElement);
// Now open the address]
viewer.openByAddress("Van Voordenpark 1B, Zaltbommel", "EPSG:29882").catch(function(err){ console.log(err.message)});

// Having StreetSmartApi intialized:
let viewer = streetSmartApi.addPanoramaViewer(viewerDomElement);
var properties = {"MyAttribute1": "MyValue1", "MyAttribute2": "MyValue2"};
viewer.setSelectedFeatureByProperties(properties, layerId);

Add a GeoJSON overlay to the panorama viewer. Can be removed with removeOverlay

var options = {name: 'My GeoJSON', geojson: {}, sourceSrs: 'EPSG:28992', sldXMLtext: 'XMLstring'};
var layer = StreetSmartApi.addOverlay(options);
var layerId = layer.id

Add a WFS Layer as overlay to the panorama viewer. Can be removed with removeOverlay

var options = {
name: 'My Super cool layer',
url: 'http://testserver.com/geoserver/streets/wfs',
typeName: 'streets:street-center-lines',
version: '1.1.0',
color: '#00ff00',
authRequired: true,
credentials: { username: 'Mike', password: 'Tyson'}
};
var layer = StreetSmartApi.addWFSLayer(options);
var layerId = layer.id

Close a panorama or oblique viewer using a window ID (wid).

Close a viewer by ID:

StreetSmartApi.open('5D4KX5SM', {
 viewerType: [StreetSmartApi.ViewerType.PANORAMA],
 srs: 'EPSG:28992',
 panoramaViewer: { replace: false, },
}).then(
 function(result) {
   if (result && result[0]) {
     setTimeout(() => {
       StreetSmartApi.closeViewer(result[0].props.id).then(
         function(res) {
           if (res) {
             console.log('Opened and closed a viewer, resulting in an empty list of viewers: ' + res);
           }
         }).catch(
           function(err) {
             console.log('error closing viewer: ' + err);
           }
         )
    }, 1000);
  }
 }).catch(
   function(reason) {
     console.log('Error opening panorama viewer: ' + reason);
   }
 )

Destroys the API. Cleans up its event handlers and makes used memory available for garbage collection.

Get the active measurement

Get the active measurement data

StreetSmartApi.getActiveMeasurement();

result:
{
type: String,
 features: [
  geometry: Object,
  properties: Object,
  type: String,
 ],
 crs: Object,
}

Returns the object containing the address search settings.

Returns the current 'ready'-state of the API.

Returns the application name of the API.

Returns the used version of the API.

Returns all logs, including ones invisible to integrators.

Returns the object containing functionalities that are currently permitted to use by the user.

Return an array with references to all viewers.

Get opened viewers:

StreetSmartApi.open('5D4KX5SM', {
 viewerType: [StreetSmartApi.ViewerType.PANORAMA],
 srs: 'EPSG:28992',
 replace: false,
}).then(
  function(result) {
    if (result && result[0]) {
      const viewers = StreetSmartApi.getViewers();
      console.log('Viewer Array:', viewers);
    }
  }).catch(
   function(reason) {
     console.log('Error opening panorama viewer: ' + reason);
   }
 )

Initializes the API using the inserted values. Required to use functional viewers.
Please choose a feet or metric system like: EPSG:26918 (UTM18 - USA) or EPSG:28992 (Netherlands)

Initializing a StreetSmartApi.

<script type="text/javascript" src="src/StreetSamrtApi.js"></script>

// Set variables for initialization.
let options = {
     targetElement: document.getElementById('streetsmartApi'),
     username: "username",
     password: "password",
     srs: "EPSG:29882",
     apiKey: "XXXX-XXXX-XXXX-XXXX",
     locale: "en-US",
     overlayDrawDistance: 30,
     addressSettings: {
         locale: "nl",
         database: "CMDatabase"
     }
};

// Initalize
StreetSmartApi.init(options).then( successCallback, errorCallback);

Method to add an event listener.

Method to add an event listener.

Method to add an event listener.

Method to add an event listener.

Open a panorama, oblique and/or point cloud viewer using a query. The query can be a coordinate, an extent, an address or a panorama/oblique ID.

Open a panorama viewer by ID:

StreetSmartApi.open('5D4KX5SM', {
  viewerType: [StreetSmartApi.ViewerType.PANORAMA],
  srs: 'EPSG:28992',
  panoramaViewer: { replace: false, },
}).then(
  function(result) {
    if (result && result[0]) {
      console.log('Opened a panorama viewer through API!', result[0]);
    }
  }
).catch(
  function(reason) {
    console.log('Error opening panorama viewer: ' + reason);
  }
)

Open a panorama viewer by coordinate and date range (this is only applicable for the panorama viewer):

StreetSmartApi.open(
{
 coordinate: [121692.34, 487812.37, 5.60],
 dateRange: {from: '2017-03-01', to: '2017-04-01'},
},
{
viewerType: [StreetSmartApi.ViewerType.PANORAMA],
srs: 'EPSG:28992',
panoramaViewer: { replace: false, },
}).then(
  function(result) {
    if (result && result[0]) {
      console.log('Opened a panorama viewer through API!', result[0]);
    }
  }
).catch(
  function(reason) {
    console.log('Error opening panorama viewer: ' + reason);
  }
)

Open a panorama viewer and oblique viewer by address:

StreetSmartApi.open('Van Voordenpark 1, Zaltbommel', {
  viewerType: [StreetSmartApi.ViewerType.PANORAMA, StreetSmartApi.ViewerType.OBLIQUE],
  srs: 'EPSG:28992',
}).then(
  function(result) {
    if (result && result[0] && result[1]) {
      console.log('Opened a panorama viewer and oblique viewer through API!', result[0], result[1]);
    }
  }
).catch(
  function(reason) {
    console.log('Error opening viewers: ' + reason);
  }
)

Open a aerial pointcloud viewer by coordinate:

StreetSmartApi.open(
{
  coordinate: [121692.34, 487812.37, 5.60],
},
{
  viewerType: [StreetSmartApi.ViewerType.POINTCLOUD],
  srs: 'EPSG:28992',
  pointcloudViewer: { pointCloudType: StreetSmartApi.PointCloudType.AERIAL }}).then(
  function(result) {
    if (result && result[0]) {
      console.log('Opened a pointcloud viewer through API!', result[0]);
    }
  }
).catch(
  function(reason) {
    console.log('Error opening pointcloud viewer: ' + reason);
  }
)

Open a panorama viewer and an aerial pointcloud viewer by coordinate:

StreetSmartApi.open(
{
  coordinate: [121692.34, 487812.37, 5.60],
},
{
  viewerType: [StreetSmartApi.ViewerType.PANORAMA, StreetSmartApi.ViewerType.POINTCLOUD],
  srs: 'EPSG:28992',
  panoramaViewer: { replace: false, },
  pointcloudViewer: { pointCloudType: StreetSmartApi.PointCloudType.AERIAL }}).then(
  function(result) {
    if (result) {
      console.log('Opened a pointcloud viewer and a panorama viewer through API!', result);
    }
  }
).catch(
  function(reason) {
    console.log('Error opening pointcloud viewer and panorama viewer: ' + reason);
  }
)

Remove a GeoJSON overlay from the panorama viewer

var layer = StreetSmartApi.addOverlay("My GeoJSON", {}, "EPSG:28992");
StreetSmartApi.removeOverlay(layer.id)

EXPERIMENTAL Set the active measurement.

Set the active measurement data

var measurement = StreetSmartApi.getActiveMeasurement();

measurement.features[0].properties.id = 'changed_measurement'

StreetSmartApi.setActiveMeasurement(measurement);

measurement:
{
type: String,
 features: [
  geometry: Object,
  properties: Object,
  type: String,
 ],
 crs: Object,
}

example crs:
{
 type: 'name',
 properties: {
     name: 'EPSG:28992',
     }
 }

set de overlay draw distance in

var layer = StreetSmartApi.addOverlay("My GeoJSON", {}, "EPSG:28992");
StreetSmartApi.setOverlayDrawDistance(50);

Start measurement mode for the given panorama viewer.

Start measurement mode without passing a geometry type. The user can then choose the measurement mode.

StreetSmartApi.startMeasurementMode(panoramaViewer);

Start measurement mode as point measurement

StreetSmartApi.startMeasurementMode(panoramaViewer, {geometry:StreetSmartApi.MeasurementGeometryType.POINT});

Start measurement mode as distance measurement

StreetSmartApi.startMeasurementMode(panoramaViewer, {geometry:StreetSmartApi.MeasurementGeometryType.LINESTRING});

Start measurement mode as surface measurement

StreetSmartApi.startMeasurementMode(panoramaViewer, {geometry:StreetSmartApi.MeasurementGeometryType.POLYGON});

Start measurement mode as surface measurement

StreetSmartApi.startMeasurementMode(panoramaViewer, {geometry:StreetSmartApi.MeasurementGeometryType.POLYGON, measureMethod: StreetSmartApi.MeasureMethods.SMART_CLICK });

Stop measurement mode

Stop measurement mode

StreetSmartApi.stopMeasurementMode();

Object which contains event type constants for all components.

Object which is an Interface for changing certain settings withing the api

Object which is an Interface for enabeling/disabeling shortcuts

Defines the Background

Type: Object

Defines the PointStyles

Type: Object

Coordinate definition

Type: Array<Number>

Type: Object

Enum for measure methods.

Type: object

Measurement Geometry types

Type: object

Definition of options for ObliqueViewer

Type: Object

Definition of oblique viewer UI elements

Type: Object

Definition of options for PanoramaViewer

Type: Object

Definition of panorama viewer UI elements

Type: object

Defines the pointSize

Type: Object

Definition of options for Point cloud viewer

Type: Object

Defines the point amount

Type: Object

Array of length four with four elements. r, g, b, a, respectively.

Type: Array

Definition of viewer types

Type: Object

Type: Object