jfbomber

Style on InfoWindow is offset by 1000px

Discussion created by jfbomber on Dec 3, 2010
Style on InfoWindow is offset by 1000px to the left when the window is shown on the right

xmin=&xmax=&ymin=&ymax=


Style on InfoWindow is offset by 1000px to the left when the window is shown on the right

HTML CODE
 <div id="photomap" style="width:650px; height:550px; "></div>




JAVASCRIPT :
var map, ymax, xmax, ymin, xmin, abbr, startExtent;
var baseUrl, dataUrl;
var baseLayer, dataLayer, infoLayer;
var geometryService;


function initMap() {
    
        xmin = -9823416;
        ymin = 5142818;
        xmax = -9821853;
        ymax = 5143771;

    // contains images
    var json = "images": { "image": [
        {
            "X": -9822278.67157321,
            "Y": 5143567.12522437
        }, 
        {
            "X": -9822700.448755,
            "Y": 5143231.12358844
        }, 
        {  "X": -9822728.89706931,
            "Y": 5143230.29294391 
        },   
        {  "X": -9822475.64522776,
            "Y": 5143564.63320335,  } ] } }                     

    startExtent = new esri.geometry.Extent(xmin, ymin, xmax, ymax, new esri.SpatialReference({ wkid: 102100 }));
    map = new esri.Map("photomap", { extent: startExtent });
    
    // Get Url
    baseUrl = "http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer";
    dataUrl = "http://crsgis.crsengineers.com:1771/ArcGIS/rest/services/AWCH/MapServer";

    // Create layers
    baseLayer = new esri.layers.ArcGISTiledMapServiceLayer(baseUrl);
    dataLayer = new esri.layers.ArcGISDynamicMapServiceLayer(dataUrl);

    // Add Layers
    map.addLayer(baseLayer);
    map.addLayer(dataLayer);
    map.infoWindow.resize(245, 150);
    
    dojo.connect(map, "onLoad", function() {
        if (json != null) {
            var jsonData = eval("(" + json + ")");
            loadImagesPoints(jsonData);
        }
        
    });
}

function loadImagesPoints(json) {
    var images = json.images.image;
    var imageCount = images.length;
    
    for (var a = 0; a < imageCount; a++) {
        var image = images[a];
        //var point = new esri.geometry.Point({ "x": parseFloat(image.UTMEasting), "y": parseFloat(image.UTMNorthing), "spatialReference": { "wkid": 102100} });
        var graphicId = "Graphic" + String(a);
        var contentHtml = "" + 
                        "<div>" + 
                            "<a style=\"border:none;\" target=\"_blank\" href=\"PhotoEdit.aspx?id=" + String(image.ImageId) + "&size=l&width=600\" >" +
                                "<img style=\"border:solid 1px gray;\"  src=\"get_photo.aspx?image_id=" + String(image.ImageId) + "&size=s\" />" +
                            "</a>" + 
                        "</div>"
        var pointJson = 
        { 
            "geometry":
            {
                "x": parseFloat(image.X), "y": parseFloat(image.Y), "spatialReference": { "wkid": 4326  }
         },  
         "attributes":
         {
             "id" : String(image.ImageId)

         },
         "symbol":
         {
             "color":[255,0,0,128], /* Symbol Color */
             "size":10,
             "angle":0, "xoffset":0, "yoffset":0,
             "type": "esriSMS",
             "style":"esriSMSSquare",
             "outline": 
             {
                 "color": [0, 0, 0, 255],
                 "width": 1,
                 "type": "esriSFS",
                 "style": "esriSMSSquare" 
                }
         },
         "infoTemplate":
         {
             "title":" " + image.ImageName + " ",
             "content": contentHtml
         }
     };
        var graphic = new esri.Graphic(pointJson);
        
        map.graphics.add(graphic);
    }
}




this is what it looks like if I apply the style
.infowindow .window { position:relative; }

Outcomes