I am unable to use the Google Street View widget when hosting a Proj4js file on my server. Line 60 in my code (after projCustomURL:) is a working url to the file when testing on my server, yet I continue to receive errors when attempting to use the widget. Any ideas? https://map.sccmo.org/Main/gis_dev/viewer/
Below is lines 1 - 202 of the code from StreetView.js
define([
'dojo/_base/declare',
'dijit/_WidgetBase',
'dijit/_TemplatedMixin',
'dijit/_WidgetsInTemplateMixin',
'dojo/_base/lang',
'dojo/aspect',
'dojo/topic',
'esri/layers/GraphicsLayer',
'esri/graphic',
'esri/renderers/SimpleRenderer',
'dojo/text!./StreetView/templates/StreetView.html',
'esri/symbols/PictureMarkerSymbol',
'dojo/dom-style',
'esri/geometry/Point',
'esri/SpatialReference',
'dijit/MenuItem',
'//cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.3/proj4.js',
'dojo/i18n!./StreetView/nls/resource',
'dijit/form/Button',
'xstyle/css!./StreetView/css/StreetView.css',
'gis/plugins/async!//maps.google.com/maps/api/js?v=3&sensor=false'
], function (declare, _WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin, lang, aspect, topic, GraphicsLayer, Graphic, SimpleRenderer, template, PictureMarkerSymbol, domStyle, Point, SpatialReference, MenuItem, proj4, i18n) {
return declare([_WidgetBase, _TemplatedMixin, _WidgetsInTemplateMixin], {
widgetsInTemplate: true,
templateString: template,
i18n: i18n,
mapClickMode: null,
panoOptions: {
addressControlOptions: {
position: google.maps.ControlPosition.TOP_RIGHT
},
linksControl: false,
panControl: false,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.SMALL
},
enableCloseButton: false
},
// in case this changes some day
//proj4BaseURL: 'http://spatialreference.org/',
// options are ESRI, EPSG and SR-ORG
// See http://spatialreference.org/ for more information
//proj4Catalog: 'ESPG',
proj4Catalog: 'ESRI',
// if desired, you can load a projection file from your server
// instead of using one from spatialreference.org
// i.e., http://server/projections/102642.js
//projCustomURL: 'gis/dijit/StreetView/projection/102696.js',
//projCustomURL: '\\1hwa-gisadpt-01/inetpub/external/Shared/102696.js',
//projCustomURL: 'C:\inetpub\external\Main\gis_dev\viewer\projection\102696.js',
projCustomURL: 'https://map.sccmo.org/Main/gis_dev/viewer/projection/102696.js',
postCreate: function () {
this.inherited(arguments);
this.createGraphicsLayer();
this.map.on('click', lang.hitch(this, 'getStreetView'));
this.own(topic.subscribe('mapClickMode/currentSet', lang.hitch(this, **strong text**'setMapClickMode')));
if (this.parentWidget) {
if (this.parentWidget.toggleable) {
this.own(aspect.after(this.parentWidget, 'toggle', lang.hitch(this, function () {
this.onLayoutChange(this.parentWidget.open);
})));
}
this.own(aspect.after(this.parentWidget, 'resize', lang.hitch(this, function () {
if (this.panorama) {
google.maps.event.trigger(this.panorama, 'resize');
}
})));
}
// spatialreference.org uses the old
// Proj4js style so we need an alias
// https://github.com/proj4js/proj4js/issues/23
window.Proj4js = proj4;
if (this.mapRightClickMenu) {
this.addRightClickMenu();
}
},
createGraphicsLayer: function () {
this.pointSymbol = new PictureMarkerSymbol(require.toUrl('gis/dijit/StreetView/images/blueArrow.png'), 30, 30);
this.pointGraphics = new GraphicsLayer({
id: 'streetview_graphics',
title: 'Street View'
});
this.pointRenderer = new SimpleRenderer(this.pointSymbol);
this.pointRenderer.label = 'Street View';
this.pointRenderer.description = 'Street View';
this.pointGraphics.setRenderer(this.pointRenderer);
this.map.addLayer(this.pointGraphics);
},
addRightClickMenu: function () {
this.map.on('MouseDown', lang.hitch(this, function (evt) {
this.mapRightClickPoint = evt.mapPoint;
}));
this.mapRightClickMenu.addChild(new MenuItem({
label: this.i18n.rightClickMenuItem.label,
onClick: lang.hitch(this, 'streetViewFromMapRightClick')
}));
},
onOpen: function () {
this.pointGraphics.show();
if (!this.panorama || !this.panoramaService) {
this.panorama = new google.maps.StreetViewPanorama(this.panoNode, this.panoOptions);
this.panoramaService = new google.maps.StreetViewService();
}
if (this.panorama) {
google.maps.event.trigger(this.panorama, 'resize');
}
},
onClose: function () {
// end streetview on close of title pane
this.pointGraphics.hide();
if (this.mapClickMode === 'streetview') {
this.connectMapClick();
}
},
onLayoutChange: function (open) {
if (open) {
this.onOpen();
} else {
this.onClose();
}
},
placePoint: function () {
this.disconnectMapClick();
//get map click, set up listener in post create
},
disconnectMapClick: function () {
this.map.setMapCursor('crosshair');
topic.publish('mapClickMode/setCurrent', 'streetview');
},
connectMapClick: function () {
this.map.setMapCursor('auto');
topic.publish('mapClickMode/setDefault');
},
clearGraphics: function () {
this.pointGraphics.clear();
domStyle.set(this.noStreetViewResults, 'display', 'block');
},
enableStreetViewClick: function () {
this.disconnectMapClick();
},
disableStreetViewClick: function () {
this.connectMapClick();
},
getStreetView: function (evt, overRide) {
if (this.mapClickMode === 'streetview' || overRide) {
var mapPoint = evt.mapPoint;
if (!mapPoint) {
return;
}
if (this.parentWidget && !this.parentWidget.open) {
this.parentWidget.toggle();
}
// convert the map point's coordinate system into lat/long
var geometry = null,
wkid = mapPoint.spatialReference.wkid;
if (wkid === 102100) {
wkid = 3857;
}
var key = this.proj4Catalog + ':' + wkid;
if (!proj4.defs[key]) {
var url = this.proj4CustomURL || this.proj4BaseURL + 'ref/' + this.proj4Catalog.toLowerCase() + '/' + wkid + '/proj4js/';
require([url], lang.hitch(this, 'getStreetView', evt, true));
return;
}
// only need one projection as we are
// converting to WGS84 lat/long
var projPoint = proj4(proj4.defs[key]).inverse([mapPoint.x, mapPoint.y]);
if (projPoint) {
geometry = {
x: projPoint[0],
y: projPoint[1]
};
}
if (geometry) {
domStyle.set(this.noStreetViewResults, 'display', 'none');
domStyle.set(this.loadingStreetView, 'display', 'inline-block');
this.getPanoramaLocation(geometry);
} else {
this.setPanoPlace = null;
this.clearGraphics();
domStyle.set(this.noStreetViewResults, 'display', 'block');
}
}
},
