原創(chuàng)|使用教程|編輯:郝浩|2013-06-20 13:35:43.000|閱讀 496 次
概述:AnyMap是一個靈活的用于創(chuàng)建地圖的控件,你可以輕松地使用它創(chuàng)建大量的地圖,本次的教程將向大家仔細講解如何創(chuàng)建一個簡單的地圖,并添加到Web頁面的具體步驟。
# 界面/圖表報表/文檔/IDE等千款熱門軟控件火熱銷售中 >>
相關(guān)鏈接:
AnyMap是一個靈活的用于創(chuàng)建地圖的控件,你可以輕松地使用它創(chuàng)建大量的地圖,本次的教程將向大家仔細講解如何創(chuàng)建一個簡單的地圖,并添加到Web頁面的具體步驟。
首先我們需要一個普通的HTML頁面,該頁面需要包含一個Flash對象,并將它放到web站點下的文件夾中:以下面的結(jié)構(gòu)在IIS wwwroot文件夾中創(chuàng)建AnyChartTest文件夾:
首先需要一些數(shù)據(jù)來創(chuàng)建地圖——一個XML文件(決定圖表應(yīng)該如何顯示地圖和哪個地圖需要顯示),Map地圖數(shù)據(jù)文件(包含地圖本身)。在這里假設(shè)我們想要展示簡單的彩色美國地圖。
我們吧這張地圖放置在states.amap file文件里面,/swf folder. amap文件是儲存地圖數(shù)據(jù)的專有格式。
我們需要創(chuàng)建XML設(shè)置文件使用這個文件并顯示地圖,如下所示:
<?xml version="1.0" encoding="UTF-8"?> <anychart> <charts> <chart plot_type="Map"> <chart_settings> <title> <text>USA Map</text> </title> </chart_settings> <data_plot_settings> <map_series source="states.amap"> <projection type="mercator" /> <undefined_map_region palette="default"> <label_settings enabled="True" /> </undefined_map_region> </map_series> </data_plot_settings> </chart> </charts> </anychart>
復(fù)制上述代碼,在任意文本編輯器中打開AnyChartTest文件夾中的anychart.xml,并粘貼代碼。
XML結(jié)構(gòu)看起來復(fù)雜,但是大多數(shù)的標簽是自我描述性的,用幾個XML語言就可以描述一切:
在<chart>節(jié)點我們設(shè)置設(shè)置一個"Map"情節(jié)類型——<chart plot_type="Map">
在<chart_settings>節(jié)點描述了的圖表大致如下所示:
設(shè)置地圖標題文本:
<title> <text>USA Map</text> </title>
在<data_plot_settings>設(shè)置"states.amap"文件用作源地圖(AnyChart包中有很多其它地圖——務(wù)必看完整個列表):
<map_series source="states.amap" />
以不同的顏色設(shè)置,并啟用所有地圖區(qū)域的狀態(tài)標簽:
<map_series source="states.amap"> <projection type="mercator" /> <undefined_map_region palette="default"> <label_settings enabled="True" /> </undefined_map_region> </map_series>
將自定義數(shù)據(jù)添加到地圖:
使用AnyMap你可以附加任何自定義數(shù)據(jù)到任何地圖,然后使用這些數(shù)據(jù)來著色、標簽、工具提示傳說和自定義操作,具體的操作請關(guān)注另一篇教程:Flash地圖控件AnyMap使用教程:將數(shù)據(jù)附加到地圖。
這是在Web網(wǎng)頁上看到地圖所需要的最后一個步驟:
下面是需要粘貼到anychart.html的代碼(在任意文本編輯器中打開它,復(fù)制粘貼代碼):
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>AnyChart Sample Flash Map </title> <script type="text/javascript" language="javascript" src="./js/AnyChart.js"></script> </head> <body> <script type="text/javascript" language="javascript"> //<![CDATA[ var chart = new AnyChart( './swf/AnyChart.swf'); chart.width = 600; chart.height = 450; chart.setXMLFile('./anychart.xml'); chart.write(); //]]> </script> </body> </html>
只有粗體文本是html代碼,你需要將AnyChart Flash Map嵌入到HTML頁面。
現(xiàn)在應(yīng)該在一個web瀏覽器中上線我們的html頁面,在本實例中,我們可以同時使用:
//localhost/AnyChartTest/anychart.html
或者
C:\Inetpub\wwwroot\AnyChartTest\anychart.html
完成所有步驟之后,就可以看到如下地圖:
本站文章除注明轉(zhuǎn)載外,均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載,但請務(wù)必注明出處、不得修改原文相關(guān)鏈接,如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn
文章轉(zhuǎn)載自:慧都控件網(wǎng)