none
Knowledge Base Article (KB): วิธีการฝัง Bing Maps ลงในหน้าของ Microsoft ASP.NET (ภาค2) RRS feed

 > 

  • การสนทนาทั่วไป

  • Discussion
    ลงชื่อเข้าใช้เพื่อโหวต
    0
    ลงชื่อเข้าใช้เพื่อโหวต

    ภาพรวมตัวอย่าง
    ในตัวอย่างโค้ดนี้ มีทั้งหมด 2 ส่วน ซึ่งอยู่ในหน้าเพจ Default.aspx สำหรับส่วนแรกจะเกี่ยวกับฟังก์ชั่นต่างๆ ของ JavaScript และในส่วนที่สองจะเกี่ยวกับโค้ด HTML ที่เป็นหน้าเพจ layout และการ input control ต่างๆ

    หมายเหตุ คุณสามารถหาหน้าเพจ Default.aspx ได้ใน Visual Studio IDE

    เพื่อที่จะฝัง Bing Maps ลงในหน้าเพจ กรุณาทำตามขั้นตอนต่อไปนี้

    1.     ให้ใส่โค้ดต่อไปนี้ เพื่อเพิ่ม Panel control ให้กับหน้าเพจ โดยให้ Panel control นั้น ชื่อ pnlMap 

    <asp:Panel ID="pnlMap" runat="server" style="position:absolute; width:400px; height:300px;" />

     

    2.     ให้ใส่โค้ดต่อไปนี้ เพื่อเพิ่มการอ้างอิงจาก JavaScript ในส่วนหัว สำหรับการทำแผนที่
    <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=6.3"></script>

     

    3.     ให้ใส่โค้ดต่อไปนี้ เพื่อเรียกใช้ฟังก์ชั่น JavaScript สำหรับการโหลดแผนที่ในขณะที่หน้าเพจกำลังโหลดไปด้วย<script type="text/javascript">

        function LoadMap() {
            // Create a new instance of the VEMap Class
            // pnlMap is the ID of the Panel
            var map = new VEMap('pnlMap');
            // Call the VEMap.LoadMap method to load the map
            map.LoadMap();
        }
    </script>

    <body onload="LoadMap();">

    4.     เมื่อคุณเรียกดูหน้าเพจ ก็จะแสดงรูปแผนที่แบบง่ายๆขึ้นมา

     

    เพื่อที่จะให้แผนที่มีลูกเล่นมากขึ้น คุณสามารถใช้ text box และ drop-down list ซึ่งจะขึ้นอยู่กับค่าที่ input values ในแต่ละ control นั้นๆ และคุณยังสามารถเรียกใช้ฟังก์ชั่นของ JavaScript ต่อไปนี้ เพื่อให้สามารถเปลี่ยนรูปแผนที่ได้

    function FindLoc() {

        var loc = document.getElementById("txtLocation").value;

        try {

            map.Find(null, loc);

        } catch (e) {

            alert(e.message);

        }

    }

    Supa Sethasiripong [MSFT]
    MSDN Community Support | Feedback to us
    Get or Request Code Sample from Microsoft
    Please remember to mark the replies as answers if they help and unmark them if they provide
    7 เมษายน 2554 11:10
    |
    ผู้ดูแล