BlueViewer 地圖加載機制深度剖析：基於 .NET Link 的 ArcIMS 二次開發核心流程

編輯：關於C語言

項目背景

BlueViewer 是 ESRI 官方示例，演示如何使用 .NET Link 連接器進行 ArcIMS 二次開發。本文從地圖初始化加載流程切入，剖析客戶端 JavaScript 與服務端 C# 協作的完整鏈路。

整體架構

┌─────────────┐     ArcXML      ┌──────────────┐     ArcXML      ┌────────────────┐
│  客戶端      │ ◄─────────────► │ Web 應用服務器 │ ◄─────────────► │ ArcIMS 應用服務器 │
│ (HTML/JS)   │   HTTP POST     │ (ASP.NET)     │   TCP/IP        │ (空間服務器)    │
└─────────────┘                 └──────────────┘                 └────────────────┘
      ▲                                 ▲
      │ .NET Link 封裝                   │ ArcObjects COM
      └─────────────────────────────────┘

一、客戶端初始化流程 (default.aspx + main.js)

1.1 服務端初始化隱藏域


// default.aspx.cs Page_Load
protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        Session["VALID_USER"] = true;
        hvMapPage.Value = "MakeMap.aspx"; // 地圖生成端點
    }

    // 獲取地圖范圍：優先 QueryString，其次默認配置
    if (Request.QueryString["XMIN"] == null || ...)
    {
        hvMinX.Value = ConfigurationManager.AppSettings["DEFAULT_EXTENT_XMIN"];
        hvMinY.Value = ConfigurationManager.AppSettings["DEFAULT_EXTENT_YMIN"];
        hvMaxX.Value = ConfigurationManager.AppSettings["DEFAULT_EXTENT_XMAX"];
        hvMaxY.Value = ConfigurationManager.AppSettings["DEFAULT_EXTENT_YMAX"];
    }
    else
    {
        hvMinX.Value = Request.QueryString["XMIN"];
        hvMinY.Value = Request.QueryString["YMIN"];
        hvMaxX.Value = Request.QueryString["XMAX"];
        hvMaxY.Value = Request.QueryString["YMAX"];
    }
}

1.2 客戶端 UI 佈局與工具初始化


// main.js startUp() 流程
function startUp() {
    posLoadingImage();      // 定位 Loading 圖標
    posBorder();            // 縮放框定位
    posBorderNavigation();  // 方位導航定位 (A)
    posTools();             // 工具欄定位 (B，依賴 A)
    
    handleToolClick();      // 綁定工具點擊 (縮放/平移)
    initCoordDisplay();     // 初始化坐標顯示 (C)
    
    // 圖片加載完成回調
    m_imgMapCanvas.onload = hideWaitImage;
}

二、請求發送與響應核心 (submit 函數)


function submit() {
    // 1. 構建請求 URL (MakeMap.aspx + 范圍參數)
    var sURL = m_hvMapPage.value + "?XMIN=" + m_mapViewer.getExtent().getLeft()
        + "&YMIN=" + m_mapViewer.getExtent().getBottom()
        + "&XMAX=" + m_mapViewer.getExtent().getRight()
        + "&YMAX=" + m_mapViewer.getExtent().getTop()
        + "&WIDTH=" + m_mapViewer.getTagWidth()
        + "&HEIGHT=" + m_mapViewer.getTagHeight();

    updateZoomLevel(m_mapViewer.getLevel());
    showWaitImage(); // 顯示 Loading

    // 2. 發送請求：通過設置 img src 觸發 HTTP GET
    m_imgMapCanvas.src = sURL;
    
    // 3. 保存當前范圍到隱藏域 (下次 PostBack 使用)
    persistExtent();
}

三、服務端地圖生成 (MakeMap.aspx.cs)

3.1 .NET Link 核心調用流程


// MakeMap.aspx.cs Page_Load 簡化邏輯
protected void Page_Load(object sender, EventArgs e)
{
    // 1. 獲取請求參數
    double xmin = double.Parse(Request["XMIN"]);
    double ymin = double.Parse(Request["YMIN"]);
    double xmax = double.Parse(Request["XMAX"]);
    double ymax = double.Parse(Request["YMAX"]);
    int width = int.Parse(Request["WIDTH"]);
    int height = int.Parse(Request["HEIGHT"]);

    // 2. 創建 ArcIMS 連接器
    ArcIMSConnector connector = new ArcIMSConnector();
    connector.Host = "localhost";
    connector.Port = 5300;
    
    // 3. 構建 ArcXML 請求
    string arcXml = BuildGetImageArcXml(xmin, ymin, xmax, ymax, width, height);
    
    // 4. 發送請求獲取響應
    string response = connector.Send(arcXml);
    
    // 5. 解析響應提取圖片 URL
    string imageUrl = ExtractImageUrl(response);
    
    // 6. 重定向到圖片流或返回 URL
    Response.Redirect(imageUrl);
}

3.2 ArcXML 請求構建示例


private string BuildGetImageArcXml(double minX, double minY, double maxX, double maxY, int w, int h)
{
    return $@"

  
    
      
        
        
        
          https://localhost/Output/
        
      
    
  
";
}

四、關鍵技術點總結

環節	技術要點	注意事項
范圍傳遞	隱藏域 + QueryString 雙重保障	PostBack 時保持范圍狀態
客戶端渲染	單圖片標籤 src 切換	無 AJAX，整頁不刷新但圖片重載
服務端封裝	.NET Link 組件 (ArcIMSConnector)	需註冊 COM 組件，部署較繁瑣
協議格式	ArcXML (專有 XML 方言)	請求/響應均為字符串構建/解析
性能瓶頸	圖片生成耗時 + 網絡傳輸	建議啟用服務端緩存、CDN 加速