passing JS variable to a java class

There are many frameworks that will help you with this. Primefaces, for example, has a google maps plugin built right in to their new JSF implementation ( http://www.primefaces.org/showcase-labs/ui/gmapHome.jsf ). Doing it by hand is also pretty easy. Just set up a Servlet to handle GET requests and use whatever Ajax method you would like to send the data to your Servlet. I'd start by looking for some Servlet and Ajax examples. Again, depending on what implementation of JSF you're using there may be Ajax tools built in already.

Best of luck.

Share and enjoy.

1. Use a hidden input <h:inputHidden value="#{bean.value}"/>.
2. Update its value using javascript.
3. Process <h:inputHidden value="#{bean.value}"/> to update its bean value.

Here is a working example:

import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;

@ManagedBean
@ViewScoped
public class Bean {

    private String value;

    @PostConstruct
    public void postConstruct() {
        value = "SERVER SIDE VALUE";
    }

    public String getValue() {
        return value;
    }

    public void setValue(String value) {
        this.value = value;
    }

}

<h:head>
    <script>
        function updateElementValue(id,value){
            document.getElementById(id).value = value;
        }
    </script>
</h:head>

<h:body>

    <h:form id="form" prependId="false">

        <p:commandButton value="UPDATE CLIENT SIDE VALUE OF INPUT-HIDDEN"
                         onclick="updateElementValue('nameInputHiddenId',
                                                     'CLIENT SIDE VALUE');
                                                      return false;"/>
        <p:commandButton value="UPDATE SERVER SIDE VALUE OF INPUT-HIDDEN" 
                         process="@form" 
                         update="dialogId" 
                         oncomplete="dialogWidgetVar.show();" />

        <h:inputHidden id="nameInputHiddenId" value="#{bean.value}" />

        <p:dialog id="dialogId" widgetVar="dialogWidgetVar">
            <h:outputText id="nameOutputTextId" value="#{bean.value}" />
            <p:commandButton value="Yes" onclick="dialogWidgetVar.hide();" />
            <p:commandButton value="No" onclick="dialogWidgetVar.hide();"/>
        </p:dialog>

    </h:form>

</h:body>

You can use <a4j:jsFunction> to pass javascript values to the managed bean. This is an example.

This is your js array

<script>
  var coordinateArray = [12, 26];
</script>

This is your page. Note that sendData is the name of your jsFunction and coordinateArray.join() converts the array to a String.

   <h:form>
    <a4j:commandButton value="Send" onclick="sendData(coordinateArray.join())"/>
    <a4j:jsFunction name="sendData">
      <a4j:actionparam name="param1" assignTo="#{hBean.coordinatesString}" />
    </a4j:jsFunction>
   </h:form>

In you managed bean

  String coordinatesString;
  String[] coordinatesArray;

  public String getCoordinatesString() {
    return coordinatesString;
  }

  public void setCoordinatesString(String coordinatesString) {
    this.coordinatesString = coordinatesString;
    this.coordinatesArray = coordinatesString.split(",");//This is what you need
  }

Edit:

---

Think a4j:jsFunction as a normal javascript function.You can put an actionParam inside it as in above sample. If so, it means that jsFunction has one argument(similar to normal javascript function argument). You give the jsFunction a name, and call it, using that given name like a normal javascript function(i.e. funcName()). If there is an actionparam inside it you should pass a parameter when you calling it(i.e. funcName(value)).
A <h:form> should not be necessarily around it. But if you want to call it when you click a commandButton, that button should be within a form.
As you say in your comment, if the name of your coordinate array is path then you call the above jsFunction like this. sendData(path.join()). You don't add any javascript code inside the jsFunction. Simply you call the jsFunction from your javascript code as you call a normal javascript function.