amMap support forum

jfrank · #1 2010-11-16 08:39:29

I am trying to interact with my map via JavaScript. As far as I can tell, the amMapCompleted() function is not being called. Here is my code:

Code:

        <script type="text/javascript" src="http://files.hungerreport.org/data/flash/swfobject.js"></script>
    <div id="flash_content">
        <strong>You need to upgrade your Flash Player</strong>
    </div>

    <script type="text/javascript">
        // <![CDATA[        
        var so = new SWFObject("http://files.hungerreport.org/data/flash/ammap/ammap.swf", "ammap", "940", "600", "8", "#FFFFFF");
        so.addVariable("path", "http://files.hungerreport.org/data/flash/ammap/");
        so.addVariable("map_id", "ammap");
        so.addVariable("data_file", escape("http://files.hungerreport.org/data/2011/feed-the-future/ammap_data.php?i=population"));
        so.addVariable("settings_file", escape("http://files.hungerreport.org/data/2011/feed-the-future/ammap_settings.xml"));        
        so.addVariable("preloader_color", "#999999");
        so.write("flash_content");
        
        var flashMovie;
        function amMapCompleted(map_id){
            alert("called amMapCompleted");
            flashMovie = document.getElementById(map_id);
        }
        // ]]>
    </script>

<h3>Choose an Indicator:</h3>

    <select id="indicator" onchange="javascript:flashMovie.reloadData('ammap_data.php?i='+this.value);flashMovie.setZoom('165%', '-25%', '-50%')">
        <option value="population">Total Population (millions) 2008</option>
        <option value="rural_pop_2000">Rural Population (% of Total Population), 2000</option>
    </select>

When I try to change the data file using the dropdown, I get an error that flashMovie is null. I put an alert in the amMapCompleted() function to see if it was ever being called, and that alert never triggers. Is there some reason why the map wouldn't call amMapCompleted? I believe I am running the latest version.

You can see this live at http://beta.hungerreport.org/2011/data/feed-the-future

qemm · #2 2010-11-16 16:15:47

It is due to Flash's security settings. ammap.swf is loaded from the host files.hungerreport.org while the page displaying it is from beta.hungerreport.org. Flash prohibits JavaScript interaction from the files loaded from different host. Try adding the following line to see if it helps:

Code:

so.addParam("allowscriptaccess","always");

jfrank · #3 2010-11-16 16:24:39

Thanks! That's definitely progress. amMapCompleted() gets called now. But I get an error:

Error: Error calling method on NPObject!
Source File: http://beta.hungerreport.org/2011/data/feed-the-future
Line: 1

Any idea what that's about?

Last edited by jfrank (2010-11-16 16:40:53)

qemm · #4 2010-11-17 05:48:16

I cannot seem to be able to reproduce this error. Have you already found a fix for that?

jfrank · #5 2010-11-17 06:33:04

No, it still seems to be occurring for me. I'm in Firefox 3.6.12 on Windows 7. It's at the same page: http://beta.hungerreport.org/2011/data/feed-the-future

If you turn on Firebug's Console or watch the debugger in Web Developer, you can see the problem. The map loads fine but when you try to change the indicator using the drop-down below the map it generates that error.

Thanks for your help,

James

jfrank · #6 2010-11-17 22:44:10

I thought this was still a matter of the cross-domain so I moved the whole file back to files.hungerreport.org and iframed it into the other website. I even made sure that all references to the included charts were relative to the domain. This worked to cure the first problem: now the drop-down selector works: http://files.hungerreport.org/data/2011 … he-future/

But, I can still generate the NPObject error. To duplicate:

1. Use either Web Developer or Firebug to watch the JavaScript errors
2. Load http://files.hungerreport.org/data/2011 … he-future/
3. Choose a different indicator using the drop-down menu. This should work fine and reload the map with new data.
4. Click on any country. It should zoom in and open some pie charts.
5. Now try to change the indicator using the drop-down. Nothing happens.
6. Click on a pie chart to make them go away and now try to change the indicator using the drop down. Now Web Developer/Firebug should report a Javascript error: "Error calling method on NPObject!"

Any ideas?

qemm · #7 2010-11-18 02:37:32

I'm having doubts about this line:

Code:

<select id="indicator" onchange="javascript:flashMovie.reloadData('ammap_data.php?i='+this.value);flashMovie.setZoom('165%', '-25%', '-50%')">

I don't think this.value is the right way to get value of the selected option in the dropdown. Should be like this:

Code:

<select id="indicator" onchange="javascript:flashMovie.reloadData('ammap_data.php?i='+this.options[this.selectedIndex].value);flashMovie.setZoom('165%', '-25%', '-50%')">

The other thing that doesn't look good to me is that you call setZoom immediately after reloadData. setZoom might throw off or get ignored while amMap is doing the reload of data. Proper way to setting zoom would be to do setZoom in amProcessCompleted:

Code:

function amProcessCompleted(map_id, process_name) {
  if (process_name == 'reloadData') {
    flashMovie.setZoom('165%', '-25%', '-50%');
  }
}

Let's try this and see how it goes.

jfrank · #8 2010-11-18 05:43:29

Implemented both changes, but it doesn't seem to have made a difference. I can still duplicate the error using the steps above.

qemm · #9 2010-11-18 23:51:21

OK, let's try something else. Set <js_enabled> to false in ALL of the Pie charts settings. They might be swallowing some amMap API calls.

jfrank · #10 2010-11-19 08:16:46

Great, that must have been it. It works nicely now. Two more questions, if it's OK:

1. Is there any way to get the pie charts to close whenever you click off of them? Currently they only close when you click on them. I'd like them to close if you click anywhere on the map. (Or two other alternatives: can I give the pie charts X buttons like the description does? Or can I link the pie charts to that country's description so that when I close the description it closes the pie charts?)

2. Is there any way to make the description close when you take another action? I'd like to close a country's description when I load a new data file. I can accomplish this by calling flashMovie.rebuild(), but that makes the whole map flash white for a second. I like how I can just reload the settings and just the colors change--it allows you to visually compare two indicators and you can't do it with the white flash--but I want to close any open descriptions at that time.

Thanks again for all your help,

James

qemm · #11 2010-11-20 02:34:56

1. You can try this hack:

a) assign oid to all of the pie chart <movie>'s as well as set remain="false" attributes for them.

b) define the following function on your page:

Code:

function amRegisterClickAnywhere(map_id, object_id, title, value){
      document.getElementById('ammap').clickObject('pie1');
}

Replace the pie1 with actual oid of one of the pie chart movies (doesn't matter which).

Now when you click anywhere on the map, all of the pie charts will be closed.

2. Again, you can simulate the click on any object (even non-existing) by calling clickObject() function. When amMap will receive clickObject instruction it should change whatever description it is now open.

jfrank · #12 2010-11-20 07:27:07

That makes sense, but I can't quite seem to get it to work. I've changed the teting URL to http://files.hungerreport.org/data/2011/beta/ because I need to launch the other version on Monday (thanks so much for your help in getting it to work).

So, on this one I implemented the code above: http://files.hungerreport.org/data/2011/beta/. I added an additional JavaScript alert() to see what's going on. As soon as I move my mouse over the map (but don't click) it seems to trigger amRegisterClickAnywhere 33 times (I have to click through 33 alert boxes) and then the whole map locks up and doesn't respond.

Is it possible that we're creating a loop? By doing an action on amRegisterClickAnywhere and then performing a click, does that send us back to amRegisterClickAnywhere to perform the same click again? Or does clickObject() only simulate a click if it can find the OID in question? And does the OID piechart exist on the map before a country with the piechart movies in it is clicked?

qemm · #13 2010-11-20 07:35:26

Yes, I forgot to warn you about the loop. Yes, clickObject generates call to amRegisterClickAnywhere. You need to set some sort of flag variable after amRegisterClickAnywhere so that subsequent calls to it are not executed. I.e.:

Code:

var clicked = false;
function amRegisterClickAnywhere(map_id, object_id, title, value){
  if (clicked) {
    clicked = false;
  }
  else {
    clicked = true;
    document.getElementById('ammap').clickObject('pie1');
  }
}

jfrank · #14 2010-11-20 18:34:10

Beautiful! Thank you so much for your help. It works very nicely.

Just FYI, clicks on map area descriptions aren't registering with amRegisterClickAnywhere. Not sure if it's supposed to be doing that or not. I just noticed it in my testing. (I had an alert on for any click, but when I would click on a description it wouldn't trigger.)

James

qemm · #15 2010-11-21 03:54:57

If you mean the text area that pops up when you click an area then it's by design. Click events for map area, not controls that display over it.

amMap support forum

Announcement

Flash amMap: Help

#1 2010-11-16 08:39:29

amMapCompleted() not being called

Code:

#2 2010-11-16 16:15:47

Re: amMapCompleted() not being called

Code:

#3 2010-11-16 16:24:39

Re: amMapCompleted() not being called

#4 2010-11-17 05:48:16

Re: amMapCompleted() not being called

#5 2010-11-17 06:33:04

Re: amMapCompleted() not being called

#6 2010-11-17 22:44:10

Re: amMapCompleted() not being called

#7 2010-11-18 02:37:32

Re: amMapCompleted() not being called

Code:

Code:

Code:

#8 2010-11-18 05:43:29

Re: amMapCompleted() not being called

#9 2010-11-18 23:51:21

Re: amMapCompleted() not being called

#10 2010-11-19 08:16:46

Re: amMapCompleted() not being called

#11 2010-11-20 02:34:56

Re: amMapCompleted() not being called

Code:

#12 2010-11-20 07:27:07

Re: amMapCompleted() not being called

#13 2010-11-20 07:35:26

Re: amMapCompleted() not being called

Code:

#14 2010-11-20 18:34:10

Re: amMapCompleted() not being called

#15 2010-11-21 03:54:57

Re: amMapCompleted() not being called