Select to view content in your preferred language

Google® Street View Widget

47972
153
06-12-2013 08:02 PM
RobertScheitlin__GISP
MVP Emeritus

All,

   Here is the next installment to my long list of widgets. I never really wanted to add to the list of several Street View Widgets, but as it's predecessors have lacked updating when new version of Flex Viewer are released and me wanting to add more features, I finally decided to do one myself.

The Google Street View Widget version 3.3 for Flex Viewer 3.3 allows you to view Google Street View Panoramas in a popup window. The widget use Google Maps API Version 3 and has almost all the API options for the Street View Panorama that are available in the API configurable in the widgets xml. A lot of attention has gone into the UI (User Inferface) and UX (User Experience) of this widget and a lot of cross browser testing has been done. Tested on Safari for windows 5.1.7, Internet Explorer 9, Opera 12.15, FireFox 21.0, and Chrome 27.0.1453.110 m.

Configurable features include:

    * hidestreetviewvwidowwhenminimized - This is a true or false value and determines if the graphic on the map and the Google Street View window are hidden when the widget is minimized.
    * width - The width of the popup widow that is opened.
    * height - The height of the popup widow that is opened.
    * apikey - The Google Maps API Key that you must obtain to use this widget.
      https://developers.google.com/maps/documentation/javascript/tutorial#api_key
    * addresscontrol - is a true or false value and determines if the Google Street View Address Control is visible.
      It has an attribute of controlposition that defines where in the popup window the control is placed.
    * clicktogo - is a true or false value and determines if the Google Street View will move to the location clicked.
    * disabledoubleclickzoom - is a true or false value and determines if the Google Street View will zoom into the
      location on the panorama where the user double clicks.
    * imagedatecontrol - is a true or false value and determines if the Google Street View will display the date of the
      panorama image was taken along the bottom of the window with the copyright info.
    * linkscontrol - is a true or false value and determines if the Google Street View will display the movement arrows
      and street names on the panorama for navigation purposes.
    * pancontrol - is a true or false value and determines if the Google Street View pan Control is visible.
      It has an attribute of controlposition that defines where in the popup window the control is placed.
    * zoomcontrol - is a true or false value and determines if the Google Street View zoom Control is visible.
      It has an attribute of controlposition that defines where in the popup window the control is placed and a
      controlstyle attribute that determines the size of the control.
   
    * All text that the widget uses is configurable in the xml to allow for internationalization of the widget.

So here it is: http://www.arcgis.com/home/item.html?id=b4259b1cf73e4fa3b04e7bdf75fee29b

Tags (2)
0 Kudos
153 Replies
SebastianRoberts
Frequent Contributor
Robert,
  In Chrome, I don't have any extensions installed.  In Firefox, just firebug.  As far as plugins, I think they are all pretty standard ones:
Firefox - Acrobat, Google earth, Google UPdate, Java, Microsot Office 2010, Flash, Silverlight
Chrome - Same as above as well as Remote Desktop viewer, and Native Client
In both browsers I tried enabling "allow all sites to show popus" with the same results.
In both browsers the popup window does open.  In Firefox, I can actually get the debugger to appear in the popup window and to stop on line 106 of the StreetView.html file, then it errors out and the console says that "google is not defined".
[ATTACH=CONFIG]27087[/ATTACH]
Sebastian
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Sebastian,

   For Google to be undefined it would seem to point to an issue with your Google API Key. Did you obtain a Google Maps API Key?
0 Kudos
SebastianRoberts
Frequent Contributor
Robert,
My first thought was that I had not set that up correctly as well, but since it is working perfectly in IE9, I think the API key must be in order.  In fact, I can see the "Google API traffic report" log the requests from IE, but I don't get any requests logged when tying to use the widget in Chrome or Firefox.
Sebastian
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Sebastian,

   Are you using the very latest versions of Chrome and Firefox? Can you get my live preview site to work in those browsers?

http://gis.calhouncounty.org/FlexViewer3.4/index.html?config=config-streetview.xml
0 Kudos
SebastianRoberts
Frequent Contributor
Robert,
  Yes both browsers are updated.  I can get your live previews to work (both 3.4 & 3.3 versions).  I must have done something screwy when I implemented the widget.  I'll try loading a fresh copy of the widget into Flash builder and recompiling it.
Sebastian
0 Kudos
SebastianRoberts
Frequent Contributor
I believe it has something to do with my publishing method using swfobject.  We have an internal and an external facing application.  One uses the static publishing method and one uses the dynamic publishing method.  If I drop the two attached index pages into the application, for the static page the street view widget fails as described in my previous posts.  With the dynamic page, it succeeds.  Any insight as to why that might be?
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Sebastian,

   My widgets are built to work with the standard Flex Viewer app (i.e. all standard files). I cannot support custom index.html pages. What is the reason that you are not going with the standard index_template.html?
0 Kudos
SebastianRoberts
Frequent Contributor
Robert,
  I understand.  Thanks for your help (and the great widget).  As I said, the issue is definitely narrowed down to the custom index page I use.  If I figure out what causes it I'll post back here.
  As for explanation of using the static publishing method for the internal version of the viewer:
  County employees don�??t have administrative rights on their desktops.  However, when visiting websites they are often prompted by the flash plugin to install an update (unrelated to the flexviewer app).  If they attempt to install an update when prompted, the flash player is corrupted such that it no longer successfully reports its version when it is queried with javascript (as is done with swfobject).  Therefore, the application would no longer load since swfojbet reports a player version of 0.0.0, and the application requires 11.1.  For unknown reasons, the swfobject static publishing method seems to handle the corrupted flash player plugin correctly, whereas the dynamic method (used by the standard Flexviewer app) does not.
0 Kudos
SebastianRoberts
Frequent Contributor
I apologize for cluttering this string with such an obscure issue, but I've resolved it, so I feel I should at least post the solution.  This only applies if using the static publishing method with swfobject in your index.html.  In that case in your index.html page, you must give the inner nested object an ID (the default html generated doesn't do this).  It seems the popup window used by the street viewer needs a reference to the flex application, and uses the ID attribute to obtain it. The inner nested object is used only by non-IE browser [if !IE], thus the failure in Chrome and Safari.
Below is an example. 
<object id="TestInternal" name="TestInternal" align="middle" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%">
    <param name="movie" value="index.swf" />
    <param name="flashvars" value="configLink=config_external2.xml" />
          <!--[if !IE]>-->
    <object id="internalObj" type="application/x-shockwave-flash" data="index.swf" width="100%" height="100%" align="middle">
    <param name="flashvars" value="configLink=config_external2.xml" />
    <!--<![endif]-->
    <div>
     This is your alternate content......
     </div>
    <!--[if !IE]>-->
    </object>
    <!--<![endif]-->
0 Kudos
DanielJohns
Frequent Contributor
Hi Robert,

Forgive me if I overlooked this solution, but how do I get the widget to work correctly on my Intranet site? If I run it locally from the compiler it works great, but as soon as it's placed on the server (IIS) and launched, the following error appears: "initialize: Invalid property value."

We're using IE9, and Flex 3.4. I tried the "Connectivity View Settings" and that did not work. I also tested out your sample site in IE9 and it works perfect.

Thank you,
Daniel
0 Kudos