Community
Select to view content in your preferred language

Hyperlink from Map Feature

3141
8
07-02-2013 07:08 AM
AliciaGiles
by
Emerging Contributor
‎07-02-2013 07:08 AM
Is there a way to bypass the infowindow and go directly to a hyperlink (via an attribute containing a web address) by clicking on a feature?

Or, to put it another way...

Right now my script is setup for an info window, but instead of pulling up the infowindow upon clicking a feature, I want to go straight to a webpage. How could I accomplish this?

EDIT 2013/07/03:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=7, IE=9, IE=10"
>

    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title>
  
    </title>

    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/dojo/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/js/esri/css/esri.css">
    <style>
      html, body, #mapDiv { height: 100%; margin: 0; padding: 0; }
    </style>

    <script>var dojoConfig = { parseOnLoad: true };</script>
    <script src="http://serverapi.arcgisonline.com/jsapi/arcgis/3.5/"></script>
    <script>



      dojo.require("esri.map");
      dojo.require("esri.layers.FeatureLayer");
      dojo.require("esri.dijit.InfoWindowLite");
 
      var map;

function init() {

     var infoWindowLite = new esri.dijit.InfoWindowLite(null, dojo.create("div"));

       map = new esri.Map("mapDiv", {
          basemap: "topo",
          center: [-95.650, 29.772],
          zoom: 11
});        
         
        var infoWindowLite = new esri.dijit.InfoWindowLite(null, dojo.create("div", null, map.root));
        infoWindowLite.startup();
        map.setInfoWindow(infoWindowLite);

        var template = new esri.InfoTemplate();
        template.setTitle("<b>${NAME}</b>");
        template.setContent("${WEB} ");
       
        var featureLayer = new esri.layers.FeatureLayer(".../MapServer/0", {
          mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
          infoTemplate:template,
          outFields: ["WEB"]
        });

        map.addLayer(featureLayer);

        map.infoWindow.resize(200, 75);
      }

      dojo.ready(init);

    </script>
  </head>
 
  <body class="claro">
    <div id="mapDiv">
    
    </div>
  </body>

</html>
0 Kudos
8 Replies
DavideLimosani
by
Frequent Contributor
‎07-02-2013 07:19 AM
Is there a way to bypass the infowindow and go directly to a hyperlink (via an attribute containing a web address) by clicking on a feature?

Or, to put it another way...

Right now my script is setup for an info window, but instead of pulling up the infowindow upon clicking a feature, I want to go straight to a webpage. How could I accomplish this?


try with the onclick event of graphicLayer

https://developers.arcgis.com/en/javascript/jsapi/graphicslayer.html

Then you have the graphic in the event and you can open the link contained in the attribute using window.open(.......)
0 Kudos
DavideLimosani
by
Frequent Contributor
‎07-02-2013 07:26 AM
Is there a way to bypass the infowindow and go directly to a hyperlink (via an attribute containing a web address) by clicking on a feature?

Or, to put it another way...

Right now my script is setup for an info window, but instead of pulling up the infowindow upon clicking a feature, I want to go straight to a webpage. How could I accomplish this?


If I understand, after your identify ( Are you using an identify?) just don't call the map.infoWindow.show() and use  window.open(.......) to open the url contained in your attribute...
0 Kudos
JeffJacobson
by
Frequent Contributor
‎07-02-2013 08:11 AM
Is there a way to bypass the infowindow and go directly to a hyperlink (via an attribute containing a web address) by clicking on a feature?

Or, to put it another way...

Right now my script is setup for an info window, but instead of pulling up the infowindow upon clicking a feature, I want to go straight to a webpage. How could I accomplish this?


You would need to register an event handler for the layer's click event.  By providing this event handler, you override the default click behavior of opening the info window.
0 Kudos
AliciaGiles
by
Emerging Contributor
‎07-03-2013 06:43 AM
If I understand, after your identify ( Are you using an identify?) just don't call the map.infoWindow.show() and use  window.open(.......) to open the url contained in your attribute...



I'm not using identify but I appreciate the suggestion! I'm going put up my script for review.
0 Kudos
AliciaGiles
by
Emerging Contributor
‎07-03-2013 06:59 AM
You would need to register an event handler for the layer's click event.  By providing this event handler, you override the default click behavior of opening the info window.


Thank you for your help. I, however, being very new to dojo was unable to successfully accomplish this. Are you suggesting a simple edit to the event handler would accomplish my goal?

I've edited my post to include the script, if you wouldn't mind taking a look.
0 Kudos
TobiasFimpel
by
Regular Contributor
‎10-21-2013 06:09 AM
Alicia, did you ever get your code to work? I'm looking to accomplish the same thing...any help would be much appreciated. Thanks!
0 Kudos
AliciaGiles
by
Emerging Contributor
‎10-25-2013 09:20 AM
Alicia, did you ever get your code to work? I'm looking to accomplish the same thing...any help would be much appreciated. Thanks!


Yes I did! The doIdentify functionality was key. Here's the code:

function initFunctionality(map) {
        dojo.connect(map, "onClick", doIdentify);

        identifyTask = new esri.tasks.IdentifyTask("http://InputYourMapServerAddress");

        identifyParams = new esri.tasks.IdentifyParameters();
        identifyParams.tolerance = 8;
        identifyParams.returnGeometry = true;
        identifyParams.layerIds = [0];
        identifyParams.layerOption = esri.tasks.IdentifyParameters.LAYER_OPTION_ALL;
        identifyParams.width  = map.width;
        identifyParams.height = map.height;
}

      function doIdentify(evt) {
        map.graphics.clear();
        identifyParams.geometry = evt.mapPoint;
        identifyParams.mapExtent = map.extent;
        identifyTask.execute(identifyParams, function(idResults) {openIdentifyLinkResult(idResults, evt); });
}

function openIdentifyLinkResult(results){

if(results[0]){
  var idResult = results[0];

  if(idResult.feature.attributes.WEB){
   window.open(idResult.feature.attributes.WEB);
  }}
}
0 Kudos
ChristopherCarr
by
Occasional Contributor
‎06-03-2014 07:27 AM
Trying to revive this thread and get this code sample to work.  Tobias, did you have any success?

Yes I did! The doIdentify functionality was key. Here's the code:

function initFunctionality(map) {
        dojo.connect(map, "onClick", doIdentify);

        identifyTask = new esri.tasks.IdentifyTask("http://InputYourMapServerAddress");

        identifyParams = new esri.tasks.IdentifyParameters();
        identifyParams.tolerance = 8;
        identifyParams.returnGeometry = true;
        identifyParams.layerIds = [0];
        identifyParams.layerOption = esri.tasks.IdentifyParameters.LAYER_OPTION_ALL;
        identifyParams.width  = map.width;
        identifyParams.height = map.height;
}

      function doIdentify(evt) {
        map.graphics.clear();
        identifyParams.geometry = evt.mapPoint;
        identifyParams.mapExtent = map.extent;
        identifyTask.execute(identifyParams, function(idResults) {openIdentifyLinkResult(idResults, evt); });
}

function openIdentifyLinkResult(results){

if(results[0]){
  var idResult = results[0];

  if(idResult.feature.attributes.WEB){
   window.open(idResult.feature.attributes.WEB);
  }}
}
0 Kudos