zoukankan      html  css  js  c++  java
  • Digitize using Fusion Viewer API in MapGuide Enterprise 2011

    As you know, we have viewer API for AjaxViewer (Basic Web Layout) to digitize point, rectangle or polygon, but how about Fusion Viewer, is there any similar API for fusion viewer? Yes, we do.

    You can refer to the MapGuideViewerApi.js, which locates at C:\Program Files\Autodesk\MapGuideEnterprise2011\WebServerExtensions\www\fusion\layers\MapGuide by default. MapGuideViewerApi mermicking the basic weblayout viewer API, including:

    function DigitizePoint(handler)

    function DigitizeLine(handler)

    function DigitizeLineString(handler)

    function DigitizeRectangle(handler)

    function DigitizePolygon(handler)

    function ClearDigitization()

    function Refresh()

    function SetSelectionXML(selectionXml)

    function ZoomToView(x, y, scale, refresh)

    In this artical, we will show you how to use digitizing.

    Firstly, we need add a custom command to invoke an URL in flexible weblayout and add it to fusion viewer. Open MapGuide Studion and create a flexible weblayout, select one template, I choose Slate here, and then create a new component based on a master type, select “Invoke URL” as master type. This new component will invoke to your page(FusionViewerAPIDemo.aspx for example) when activated. Remember to add it to the Task Pane or other containner to display it.

    image

    Now, let’s go the page FusionViewerAPIDemo.aspx. The code goes like below:

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="FusionViewerAPIDemo.aspx.cs"
        Inherits="FusionViewerAPIDemo" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <%--reference the fusion viewer API javascript file--%>
        <script type="text/javascript" language="javascript" src="../mapguide2011/fusion/layers/MapGuide/MapGuideViewerApi.js"></script>
        <script type="text/javascript">

            function showCoordniate(geomText) {
                document.getElementById('coordResult').innerHTML = geomText;
            }

            function OnDigitizePoint() {
                //ClearDigitization();
                DigitizePoint(OnPointDigitized)
            }

            function OnPointDigitized(point) {
                var geomText = point.X + "," + point.Y;
                showCoordniate(geomText);
            }

            function OnDigitizeRectangle() {
                //ClearDigitization();
                DigitizeRectangle(OnRectangleDigitized);
            }

            function OnRectangleDigitized(rectangle) {
                var geomText = "5,"
                    + rectangle.Point1.X + "," + rectangle.Point1.Y + ","
                    + rectangle.Point2.X + "," + rectangle.Point1.Y + ","
                    + rectangle.Point2.X + "," + rectangle.Point2.Y + ","
                    + rectangle.Point1.X + "," + rectangle.Point2.Y + ","
                    + rectangle.Point1.X + "," + rectangle.Point1.Y;

                showCoordniate(geomText);

            }

            function OnDigitizePolygon() {
                //ClearDigitization();
                DigitizePolygon(OnPolyonDigitized);
            }

            function OnPolyonDigitized(polygon) {
                var geomText = polygon.Count;
                for (var i = 0; i < polygon.Count; i++) {
                    geomText += "," + polygon.Point(i).X + "," + polygon.Point(i).Y;
                }

                showCoordniate(geomText);

            }

        </script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <input type="button" name="" value="point" class="Ctrl" id="pntButton" onclick="OnDigitizePoint()"
                style=" 30%" />
            <input type="button" name="" value="rectangle" class="Ctrl" id="rectButton" onclick="OnDigitizeRectangle()"
                style=" 30%" />
            <input type="button" name="" value="polygon" class="Ctrl" id="polyButtton" onclick="OnDigitizePolygon()"
                style=" 30%" />
            <input type="button" name="" value="clear" class="Ctrl" id="clearButton" onclick="ClearDigitization()"
                style=" 30%" />
            <hr />
            Coordinate Result:<br />
            <div id="coordResult" style="height: 50; 100; overflow: scroll; color: InfoText">
                Coordinate Result shows here...</div>
        </div>
        </form>
    </body>
    </html>

    Run it the application and play with it, it should work now!

    image

    Happy MapGuiding!

    峻祁连

    作者:峻祁连
    邮箱:junqilian@163.com
    出处:http://junqilian.cnblogs.com
    转载请保留此信息。
  • 相关阅读:
    什么叫“全力以赴”?
    Hibernate 异常 —— Unable to instantiate default tuplize
    也许用得着的英文短语(持续整理)
    也许用得着的英文句子(持续更新)
    iPhone(iOS设备) 无法更新或恢复时, 如何进入恢复模式
    poj 2778 DNA Sequence(AC自动机 + 矩阵快速幂)
    hdu 3974 线段树 将树弄到区间上
    hdu 2865 Polya计数+(矩阵 or 找规律 求C)
    Polya计数
    poj 2888 Magic Bracelet(Polya+矩阵快速幂)
  • 原文地址:https://www.cnblogs.com/junqilian/p/1751563.html
Copyright © 2011-2022 走看看