nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Google Street View Widget for the Flexviewer

andrewj_ca

I wanted to get some feedback on my street view widget for the Flexviewer 2.*, Check it out here:

http://www.arcgis.com/home/item.html?id=f069d8a3aa304e29a432b48e5f64ca74

Finde mehr Beiträge mit dem Tag

Accepted answers

All comments

andrewj_ca

Great, be sure to rate the widget once you're up and running.

VenkatM

Definitely.. with my pleasure.

-Venkat.

VenkatM

Hi Andrew,

I have a question regarding Flexviewer2.2, I know it is not appropriate place to ask, just for the curiousity. Where can I find code related to the icon at bottom right corner i.e 'Powered by ESRI' icon?

Thanks in advance.

-Venkat.

andrewj_ca

Venkat,

The ESRI map object has a logoVisible property which you can set to false.

VenkatM

Venkat,

The ESRI map object has a logoVisible property which you can set to false.

Thank you..

-Venkat.

andrewj_ca

Has anyone that has downloaded or used my code for the Street View Widget had any issues of late? Starting this week, all my apps that use the street view code have stopped working or has intermittent problems. Wondering if it's the api or something else that's going on here.

haThach

Has anyone that has downloaded or used my code for the Street View Widget had any issues of late? Starting this week, all my apps that use the street view code have stopped working or has intermittent problems. Wondering if it's the api or something else that's going on here.

I recently has intermittent problems only within the street view when trying to use the go forward or backward arrow, which result in a grey window. But the initial startup, click on the street or drag the human icon to a different location seem to work fine. Any idea why? I'm currently using ie8 with flexviewer v2.3. Thanks!

1.png

2.png

JamesKo

Andrew,

I'm having the same problems as mentioned above. However, it does work in firefox and google chrome. One interesting note, if you try the code examples from google's own website on IE, you'll notice the same behaviour.

Regards,
James

GeorgiannaStrode

I can't compile Street View 2.4 with SFV 2.5.

The error is inside FrStreetView/WebForm.mxml at line 39 <flexiframe:IFrame .....

The error says:

"Could not resolve <flexiframe:IFrame> to a component implementation"

Any suggestions are greatly appreciated.

GeraldLegacy

HI Andrew,

Just tried your Street Widget ... on your webpage it looks great! I am fairly new at this Ia m usinf ArcGis viewer for Flex 3.0. I have copy and paste the compiled 3.0 to the widget added the widge string to the congif.xml and I am having a problem the widget is open, I click on the icon to start the street viewer and click on a street and nothing. I don't what is wrong...

Can you please help ?

Gerald
GIS Analyst
Moncton, NB

andrewj_ca

HI Andrew,

Just tried your Street Widget ... on your webpage it looks great! I am fairly new at this Ia m usinf ArcGis viewer for Flex 3.0. I have copy and paste the compiled 3.0 to the widget added the widge string to the congif.xml and I am having a problem the widget is open, I click on the icon to start the street viewer and click on a street and nothing. I don't what is wrong...

Can you please help ?

Gerald
GIS Analyst
Moncton, NB

Gerald,

This code isn't currently compiled for the 3.0 viewer. I have seen a few comments from other people have have successfully ported it over the the new 3.0 viewer. When I get an opportunity I will be updating the code, but for now I'd suggest looking at some of the other uploads from people. Sorry I've haven't been much help here.

Andrew

PawanVuppala

This is a great widget to have. I tried it with 3.0 viewer by copying the compiled version under sv_api_v3 folder abd it never worked for me. However I have a 2.5 version that seems to work but, I'd really love to get it upgraded.

Thanks!

Gerald,

This code isn't currently compiled for the 3.0 viewer. I have seen a few comments from other people have have successfully ported it over the the new 3.0 viewer. When I get an opportunity I will be updating the code, but for now I'd suggest looking at some of the other uploads from people. Sorry I've haven't been much help here.

Andrew

andrewj_ca

Updated 3.0 API code found here. Install instructions to follow but I wanted to get the code out there.
Cheers,

Andrew

http://www.arcgis.com/home/item.html?id=b721eec8dde442559e9c17acecd22188

PawanVuppala

This works great !! Thanks Andrew. For all those who are using Robert's eSearch widget this works now on top of Streetview widget..I been wanting to be able to use these two for a while and now I finally can!!

Thanks again you guys for wonderful widgets.

Updated 3.0 API code found here. Install instructions to follow but I wanted to get the code out there.
Cheers,

Andrew

http://www.arcgis.com/home/item.html?id=b721eec8dde442559e9c17acecd22188

andrewj_ca

No problem, don't forget to rate it. Cheers

MLowry

Great work Andrew. That is quite a large download at 40MB!

Going to check out your source code shortly.

andrewj_ca

GISProgrammer9,

I've updated the size of the download. I also included a couple of readme files for those who are interested.

Andrew

PawanVuppala

Hi Andrew,
Thanks again for this great widget. Wondering if theres a way to add the Image Date as shown in the Google Streetview page. Its
at the bottom left on the google page but, can't see that in our widget. This would really add great value to the maps that we use.

Thanks in advance.

-Pawan

GISProgrammer9,

I've updated the size of the download. I also included a couple of readme files for those who are interested.

Andrew

Google Street View Image Date.JPG

SeanSpansel

This is an excellent add-on and thanks for providing the help for others to get it running. I'm having some of the same issues as listed above and I've hit a brick wall on trying to think up a way to fix it.

I'm using the compiled version, followed the readme (btw, using Streetview_v3.0 file) and I'm getting the widget/icons/etc but when I place the StreetGuy, I'm not getting the popup window with 360 view. Inside of the flexviewer 3.0 program, it works, but when I follow the web address it doesn't.

Any help would be greatly appreciated. I've done

andrewj_ca

Sean Spansel,

Do you mind posting the contents of your index.html?

AndrewKeith1

Andrew,
I too am having the same problem of the window not loading at the bottom. I have verified that StreetView exists for area. Could you please help. Here is my index.html file that I am using. Thanks in advance.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <title>Web App</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="description" content="Esri ArcGIS viewer for Flex"/>
        <meta name="keywords" content="Esri, ArcGIS, Flex Viewer"/>
        <meta name="author" content="Esri"/>

        <!-- Include CSS to eliminate any default margins/padding and set the height of the html element and
             the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as
             the percentage of the height of its parent container, which has to be set explicitly.  Fix for
             Firefox 3.6 focus border issues.  Initially, don't display flashContent div so it won't show
             if JavaScript disabled.
        -->
        <style type="text/css" media="screen">
            html, body  { height:100%; }
            body { margin:0; padding:0; overflow:auto; text-align:center;
                   background-color: #ffffff; }
            object:focus { outline:none; }
            #flashContent { display:none; }
        </style>

        <!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens -->
        <!-- BEGIN Browser History required section >
        <link rel="stylesheet" type="text/css" href="history/history.css" />
        <script type="text/javascript" src="history/history.js"></script>
        <! END Browser History required section -->

        <script type="text/javascript">
            var isIElt9 = false;
        </script>
        <!--[if lt IE 9]>
            <script type="text/javascript">
                isIElt9 = true;
            </script>
        <![endif]-->

<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script> 
        <script type="text/javascript" src="widgets/StreetView/streetview.js"></script>

        <script type="text/javascript" src="swfobject.js"></script>
        <script type="text/javascript">
            <!-- For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. -->
            var swfVersionStr = "11.1.0";
            <!-- To use express install, set to playerProductInstall.swf, otherwise the empty string. -->
            var xiSwfUrlStr = "playerProductInstall.swf";
            var flashvars = {};
            flashvars.localeChain = "en_US";
            flashvars.resourceModuleURLs = "assets/locale/en_US.swf";
            //flashvars.localeChain = "ar";
            //flashvars.resourceModuleURLs = "assets/locale/ar.swf";
            //flashvars.localeChain = "de_DE";
            //flashvars.resourceModuleURLs = "assets/locale/de_DE.swf";
            //flashvars.localeChain = "es_ES";
            //flashvars.resourceModuleURLs = "assets/locale/es_ES.swf";
            //flashvars.localeChain = "fr_FR";
            //flashvars.resourceModuleURLs = "assets/locale/fr_FR.swf";
            //flashvars.localeChain = "it_IT";
            //flashvars.resourceModuleURLs = "assets/locale/it_IT.swf";
            //flashvars.localeChain = "ja_JP";
            //flashvars.resourceModuleURLs = "assets/locale/ja_JP.swf";
            //flashvars.localeChain = "ko_KR";
            //flashvars.resourceModuleURLs = "assets/locale/ko_KR.swf";
            //flashvars.localeChain = "nb_NO";
            //flashvars.resourceModuleURLs = "assets/locale/nb_NO.swf";
            //flashvars.localeChain = "nl_NL";
            //flashvars.resourceModuleURLs = "assets/locale/nl_NL.swf";
            //flashvars.localeChain = "pl_PL";
            //flashvars.resourceModuleURLs = "assets/locale/pl_PL.swf";
            //flashvars.localeChain = "pt_BR";
            //flashvars.resourceModuleURLs = "assets/locale/pt_BT.swf";
            //flashvars.localeChain = "ro_RO";
            //flashvars.resourceModuleURLs = "assets/locale/ro_RO.swf";
            //flashvars.localeChain = "ru_RU";
            //flashvars.resourceModuleURLs = "assets/locale/ru_RU.swf";
            //flashvars.localeChain = "sv_SE";
            //flashvars.resourceModuleURLs = "assets/locale/sv_SE.swf";
            //flashvars.localeChain = "zh_CN";
            //flashvars.resourceModuleURLs = "assets/locale/zh_CN.swf";
            var params = {};
            params.quality = "high";
            params.bgcolor = "#ffffff";
            params.allowscriptaccess = "sameDomain";
            params.allowfullscreen = "true";
            var isAIR = navigator.userAgent.indexOf("AdobeAIR") != -1;
            if (isAIR || isIElt9)
            {
                // workaround for overlaying tool tips and other content when loaded into an AIR app
                // workaround for cursor issue - https://bugs.adobe.com/jira/browse/SDK-26818
                params.wmode = "opaque";
            }
            var attributes = {};
            attributes.id = "index";
            attributes.name = "index";
            attributes.align = "middle";
            swfobject.embedSWF(
                "index.swf", "flashContent",
                "100%", "100%",
                swfVersionStr, xiSwfUrlStr,
                flashvars, params, attributes);
            <!-- JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. -->
            swfobject.createCSS("#flashContent", "display:block;text-align:left;");
        </script>
    </head>
    <body>
        <!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough
             JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show
             when JavaScript is disabled.
        -->
        <div id="flashContent">
            <p>
                To view this page ensure that Adobe Flash Player version
                11.1.0 or greater is installed.
            </p>
            <script type="text/javascript">
                var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://");
                document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='"
                                + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" );
            </script>
        </div>

        <noscript>
            <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="index">
                <param name="movie" value="index.swf" />
                <param name="quality" value="high" />
                <param name="bgcolor" value="#ffffff" />
                <param name="allowScriptAccess" value="sameDomain" />
                <param name="allowFullScreen" value="true" />
                <!--[if !IE]>-->
                <object type="application/x-shockwave-flash" data="index.swf" width="100%" height="100%">
                    <param name="quality" value="high" />
                    <param name="bgcolor" value="#ffffff" />
                    <param name="allowScriptAccess" value="sameDomain" />
                    <param name="allowFullScreen" value="true" />
                <!--<![endif]-->
                <!--[if gte IE 6]>-->
                    <p>
                        Either scripts and active content are not permitted to run or Adobe Flash Player version
                        11.1.0 or greater is not installed.
                    </p>
                <!--<![endif]-->
                    <a href="http://www.adobe.com/go/getflashplayer">
                        <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" />
                    </a>
                <!--[if !IE]>-->
                </object>
                <!--<![endif]-->
            </object>
        </noscript>
   </body>
</html>

rcravidao_1-1643882192840.png

deleted-user-yA_w_FC9FKe5

Thanks for creating this. It is very cool. I'm having the same issue as others. I've tried a couple of things. One was just using the compiled version but everything works as plan except opening up the streetview window that should be at the bottom of the map.

So I also tried using the uncompiled code. Rather new to that but it actually works now. However, I can't actually get that swf file to work with my real map that is on the server.

I have a feeling it has to do with the index code which I don't know much about but I am guessing this is what controls the window for the streetview. Since the uncomplied version does not have a index.html but rather a index.template.html I'm not sure how to fix this. I tried the index.html with the complied version but no go.

Both files have this when I view the source:
<script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
<script type="text/javascript" src="widgets/StreetView/streetview.js"></script>

Any suggestions? Since it works in the uncompiled but not the complied version I create or that you sent it must be something simple.

andrewj_ca

See highlighted missing items in index.html. The html that you provided is not what I provided as part of the download.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <title>ArcGIS Viewer for Flex</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="description" content="Esri ArcGIS viewer for Flex"/>
        <meta name="keywords" content="Esri, ArcGIS, Flex Viewer"/>
        <meta name="author" content="Esri"/>

        
        <style type="text/css" media="screen">
            html, body { height:100%; }
            body { margin:0; padding:0; overflow:auto; text-align:center;
                   background-color: #ffffff; }
            object:focus { outline:none; }
            #flashContent { display:none; }
        </style>

        
        

        <script type="text/javascript">
            var isIElt9 = false;
        </script>
        

        <script src="http://maps.googleapis.com/maps/api/js?sensor=false" type="text/javascript"></script>
        <script type="text/javascript" src="widgets/StreetView/streetview.js"></script>

        <script type="text/javascript">
            var _gaq = _gaq || [];
            _gaq.push(['_setAccount', 'UA-26683112-1']);
            _gaq.push(['_trackPageview']);

            (function() {
              var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
              ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
              var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
            })();
        </script>

        <script type="text/javascript" src="swfobject.js"></script>
        <script type="text/javascript">
            
            var swfVersionStr = "11.1.0";
            
            var xiSwfUrlStr = "playerProductInstall.swf";
            var flashvars = {};
            var params = {};
            params.quality = "high";
            params.bgcolor = "#ffffff";
            params.allowscriptaccess = "sameDomain";
            params.allowfullscreen = "true";
            var isAIR = navigator.userAgent.indexOf("AdobeAIR") != -1;
            if (isAIR || isIElt9)
            {
                // workaround for overlaying tool tips and other content when loaded into an AIR app
                // workaround for cursor issue - https://bugs.adobe.com/jira/browse/SDK-26818
                params.wmode = "opaque";
            }
            var attributes = {};
           attributes.id = "agsview3";
            attributes.name = "agsview3";
            attributes.align = "middle";
            swfobject.embedSWF(
                "index.swf", "flashContent",
                "100%", "100%",
                swfVersionStr, xiSwfUrlStr,
                flashvars, params, attributes);
            
            swfobject.createCSS("#flashContent", "display:block;text-align:left;");
        </script>
    </head>
    <body>
        
        <div id="flashContent">
            <p>
                To view this page ensure that Adobe Flash Player version
                11.1.0 or greater is installed.
            </p>
            <script type="text/javascript">
                var pageHost = ((document.location.protocol == "https:") ? "https://" : "http://");
                document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='"
                                + pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" );
            </script>
        </div>

        <noscript>
            <object id="agsview3" name="agsview3" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="index">
                <param name="movie" value="index.swf" />
                <param name="quality" value="high" />
                <param name="bgcolor" value="#ffffff" />
                <param name="allowScriptAccess" value="sameDomain" />
                <param name="allowFullScreen" value="true" />
                
                <object type="application/x-shockwave-flash" data="index.swf" width="100%" height="100%">
                    <param name="quality" value="high" />
                    <param name="bgcolor" value="#ffffff" />
                    <param name="allowScriptAccess" value="sameDomain" />
                    <param name="allowFullScreen" value="true" />
                
                
                    <p>
                        Either scripts and active content are not permitted to run or Adobe Flash Player version
                        11.1.0 or greater is not installed.
                    </p>
                
                    <a href="http://www.adobe.com/go/getflashplayer">
                        <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" />
                    </a>
                
                </object>
                
            </object>
        </noscript>
   </body>
</html>

deleted-user-yA_w_FC9FKe5

I created a new html file and copied/pasted your code into this file. I then went to my viewer project and went into the main folder where I saved this file over top the existing index.html file. Did I do this correctly?

I am still having the same issue.

One idea on what could be wrong is that I am seeing a smiley face in this line for your posted code:

This is what I had.
<object id="agsview3" name="agsview3" classid="clsid27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="index">

So I added a ": D" between the clsid and 27CD86E :
<object id="agsview3" name="agsview3" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="index">

The fact that this is working in my uncompiled code but not in my complied code must mean it is something simple. I've even removed all widgets except for this one. Do you have to have a certain layer loaded?

andrewj_ca

The smiley face should be - 😄

deleted-user-yA_w_FC9FKe5

Thanks Andrew but it is still not working. I'm pretty baffled that it does not. Any suggestions?

TonyBlades

See highlighted missing items in index.html. The html that you provided is not what I provided as part of the download.

Andrew,
I copied the code from your post this morning and created a new index file. It's still not working for me. My Java savvy co-worker is on vacation this week so please bear with me. On line 104, is that a big grin or is it really "clsid:D27CDB6E..."? Any other thoughts?
Tony

deleted-user-yA_w_FC9FKe5

Andrew,
I copied the code from your post this morning and created a new index file. It's still not working for me. My Java savvy co-worker is on vacation this week so please bear with me. On line 104, is that a big grin or is it really "clsid:D27CDB6E..."? Any other thoughts?
Tony

Tony I think you and I have the same issue. From Andrew's comment to me it sounds like you have the right assmumption for the clsid:. I've tried it both ways and still have the same issue.

What is weird for me is that it works in flex/flash builder for me but when I try any compiled version it will not open the bottom pane to see the street view.

So it rules out the browser which is IE 8 and should rule out any of the flash components or anything to do with the server or PC. What would be different from the uncompiled code and the compiled code? I've copied over the compiled code created by the Flash Builder. I've tried the compiled code from the download and even the privious _v3 file but none of them work.

Starting to drive me crazy. I would really love to get this to work.

Bowtruckle.png

TonyBlades

Tony I think you and I have the same issue. From Andrew's comment to me it sounds like you have the right assmumption for the clsid:. I've tried it both ways and still have the same issue....

Michael, I agree. Sounds the same. I haven't worked with the compiled version yet. I'll look into that today. Hopefully one of us finds a solution soon. Tony

SteveNelson

Just tagging onto this thread to confirm I'm having the same issue with the compiled version.
If there's anything I can do/test to help out just let me know.

I had an issue with a previous verson of this streetview tool where it conflicted with other widgets that were included in my project - so I'm going to remove all other widgets just to see if this makes any difference.
Cheers
Steve

*EDIT - just noticed someone already tried removing all other widgets..

Nimm an der Diskussion teil

Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.

Schnellzugriffe

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.