kmeseck

Embedding an ArcGIS Server 10 Mapping Application in a Website using Javascript API

Discussion created by kmeseck on May 7, 2013
Latest reply on May 8, 2013 by ciava.at
Hi,

So I didn't think it would be so difficult to find an answer to this, but after pouring through all of the samples on the ArcGIS API for JavaScript I still haven't found what I need. My problem is that I created and uploaded a map to ArcGIS Server 10 and created an application from that web service. I have the URL for that application and simply want to embed this application in my website. I was told Javascript API could do this, but all I'm getting out of the samples is how to build a map from scratch using the different widgets and dojos. The map service that I created can already do everything that I want it to do, all I need to do is embed the service in a web page. I tried the code below, which is essentially the code from the "add a world streetmap" sample, but I can't find where to add in my URL link to the mapping application. Also, I did see this video: http://help.arcgis.com/en/webapi/javascript/arcgis/jshelp/videos/sample_using.htm, and tried the code, (which incidentally does have a place to add the URL) but it didn't work (too old maybe?). I would greatly appreciate any advice on this. Thanks so much! -Kristin

<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">
   <!-- The viewport meta tag is used to improve the presentation and behavior of the samples
     on iOS devices -->
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
   <title>World Street Map</title>

  <!-- <link rel="stylesheet" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/dojo/dijit/themes/claro/claro.css"> -->
   <link rel="stylesheet"
href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.4/js/esri/css/esri.css">
   <style>
       html, body, #map {
           padding: 0;
           margin: 0;
           height: 90%;
           width: 80%;
       }
   </style>

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

</head>

<body class="claro">
   <div id="map">
   <script>
       dojo.require("esri.map");
       var map;dojo.ready(function () {
           map = new esri.Map("map", {
                               basemap: "http://cezanne/Group1/Default.aspx",
               center: [-117.100, 32.700],
               zoom: 11
                               });
//<!-- Our Map link -->
           var tiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer("http://cezanne/Group1/Default.aspx");
           map.addLayer(tiledMapServiceLayer);

       });
   </script>
</div>
</body>
</html>

Outcomes