Google Analytics API called by C#

這是可以透過Google Analytics API 去抓出你網站的拜訪資料的功能，主要是送一個Request，再接收XML檔案，下面分兩段說明，首先是抓回XML的部份，：
(以下內容是參考 http://www.dotblogs.com.tw/lastsecret/archive/2010/10/06/18157.aspx )

private void GetXml() {  
        //送出request的網址
        var request = (HttpWebRequest)HttpWebRequest.Create(
            //在這是取國家的訪客數，參數可參考http://code.google.com/intl/zh-TW/apis/analytics/docs/gdata/gdataReferenceDataFeed.html#maxResults
            string.Format("https://www.google.com/analytics/feeds/data?"+                        
                            "ids=ga%3A{0}&dimensions=ga%3Acountry" +
                            "&metrics=ga%3Avisits&" +
                            "start-date={1}&end-date={2}&sort=-ga%3Avisits&max-results=10",
                            "12345678",  //Google Analytics 網站的ID
                            "2011-09-24",
                            DateTime.Now.ToString("yyyy-MM-dd")));

        //在header必須帶入token，token的取得請看下方的方法
        request.Headers.Add("Authorization", "GoogleLogin auth=" + GetAuthToken());

        try {
            var response = request.GetResponse();

            var responseContent = new StreamReader(response.GetResponseStream()).ReadToEnd();

            //抓到XML, 存到暫存資料夾
            StreamWriter rd = File.CreateText(Server.MapPath("~/TempFile") + @"\Analytics_Country.xml");
            rd.Write(responseContent);
            rd.Flush();
        } catch (Exception ex) {
            Javascript.Alert(this.Page, "Error：" + ex.ToString());
        }
}

private static string GetAuthToken() {
        var postContent = string.Format(@"accountType=GOOGLE&Email={0}&Passwd={1}&service=analytics&source={2}",
                                         "Account", //Google 同號
                                         "PWD", //Google 密碼
                                         "1234"//隨便
                                        );

        byte[] bPostData = Encoding.ASCII.GetBytes(postContent);

        //參數與用法
        //參考http://code.google.com/intl/zh-TW/apis/accounts/docs/AuthForInstalledApps.html
        HttpWebRequest req = (HttpWebRequest)HttpWebRequest.Create("https://www.google.com/accounts/ClientLogin");
        req.Method = "POST";
        req.ContentType = "application/x-www-form-urlencoded";
        req.ContentLength = bPostData.Length;

        var reqStream = new StreamWriter(req.GetRequestStream());

        reqStream.Write(postContent);
        reqStream.Flush();

        HttpWebResponse rep = (HttpWebResponse)req.GetResponse();
        StreamReader repStream = new StreamReader(rep.GetResponseStream(), Encoding.UTF8);
        string ctx = repStream.ReadToEnd();

        //送出的response抓取token的值
        return Regex.Split(ctx, "Auth=", RegexOptions.IgnoreCase)[1];
     
    }  

再來是抓XML中的資料：
(以下內容是參考http://www.reimers.dk/jacob-reimers-blog/added-google-analytics-reader-for-net)

protected void GetData(object sender, EventArgs e) {
        //讀XML檔案
        XDocument xmlDoc = XDocument.Load(Server.MapPath("~/TempFile") + "/Analytics_Country.xml");
        XNamespace defaultSpace = xmlDoc.Root.GetDefaultNamespace();
        XNamespace dxpSpace = xmlDoc.Root.GetNamespaceOfPrefix("dxp");
     
        //LINQ  XML    
        var datas = from entry in xmlDoc.Root.Descendants(defaultSpace + "entry")
                    select new {
                        Country = entry.Element(dxpSpace + "dimension").Attribute("value").Value,
                        Value = entry.Element(dxpSpace + "metric").Attribute("value").Value
                    };
     
        foreach (var entry in datas) {          
            Response.Write("Country:" + entry.Country);
            Response.Write("Visits: " + entry.Value + "<br />");
        }
        //datas.ToDictionary<string, int>(m => m.Country, m => m.Value);
    }

Google Map JavaScript API v3 實作滑鼠右鍵(Right Click)選單

要實作Google Map的右鍵選單，可參考下列做法，在實作之前，先做好Google Map API的一些基本動作，不熟的人可以參考之前的文章中1. Google Map  初始化這段。接著就可以參考下面的動作了。


首先可以先設定一個CSS的Class，如下：

.contextMenu {
       position: absolute;
       min-width: 100px;
       z-index: 1000;  /* 必要 */
       background: #fff;
       border-top: solid 1px #CCC;
       border-left: solid 1px #CCC;
       border-bottom: solid 1px #676767;
       border-right: solid 1px #676767;
       padding: 0px;
       margin: 0px;
       display:none;    /* 預設為不顯示 */
       font-size:smaller;
}

其中有個很重要的一點，就是z-index這個屬性一定要給，如果沒給的話，不管你怎麼按右鍵、改程式，選單都不會出來。原因的話，我還沒查到...= = (這是心路歷程)。

再來可以寫一個DIV，就是要在滑鼠右鍵按下( Right Click)時顯示的選單，把class設剛剛寫好的CSS Class：

<div id="rightMenu" class="contextMenu">
    <a>設為起點</a>    
    <a>設為終點</a>   
</div>

在接下來的JavaScript部份，因為有使用jQuery語法，所以必須要include jQuery，請在<head>中加入這一行程式：

<script type="text/javascript" src="jquery-1.6.1.min.js"></script>

接下來就是JavaScript部份了：

<script language='javascript'>
    var contextMenu = $("#rightMenu");    //宣告物件
    $(map.getDiv()).append(contextMenu);          
  
    //加入事件
    google.maps.event.addListener(map, "rightclick", function(e) {     
        //先隱藏div
        contextMenu.hide();

        var mapDiv = $(map.getDiv());
        var x = e.pixel.x;
        var y = e.pixel.y;              

        //當選單太靠近邊界時，調整選單位置
        if (x > mapDiv.width() - contextMenu.width()) {
            x -= contextMenu.width();
        }
        if (y > mapDiv.height() - contextMenu.height()) {
            y -= contextMenu.height();
        }
        //設定座標，並加入動畫
        contextMenu.css({ top: y, left: x }).fadeIn(100);                    
    });

    //當下列事件觸發時，隱藏選單
    $.each('click dragstart zoom_changed maptypeid_changed'.split(' '),  
        function(i, name) {
            google.maps.event.addListener(map, name, function() {
                contextMenu.hide()
            });
    });
</script>

參考資料：
http://www.pinsoftstudios.com/tips/google-maps-api-v3-right-click-context-menu

Google Map JavaScript API v3 的一些常用語法

下列是使用Google Map API時的一些常用的語法

1. Google Map  初始化：
先 include google map api

<script type="text/javascript"src="http://maps.google.com/maps/api/js?sensor=false" ></script>

接著在Body中加入下面這個Div，這個Div是要用來顯示Google Map的物件

<div id="map_canvas" style="width:300px;height:300px;"></div>

接著加入下面的JavaScript程式碼，可以 寫在body的onload事件 或 jQuery的 $(document).ready 中

var latlng = new google.maps.LatLng(23.69781, 120.96051499999999);  //台灣座標
var myOptions = {
    zoom: 15,    //地圖縮放比例，數字越大，路越大
    center: latlng,  //地圖的中心座標
    mapTypeId: google.maps.MapTypeId.ROADMAP  //地圖型態，可參考 這裡
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

2. 新增Marker：

var myLatlng = new google.maps.LatLng(23.69781, 120.96051499999999);
var marker = new google.maps.Marker({
    position: myLatlng,    //Marker的座標
    map: map,    //map物件，以這篇文章的例子，就是上面那個map物件
    title: 'title'    //當滑鼠移至Marker上時，要顯示的Title文字
});

3. 在Marker click時，顯示InfoWindow：

google.maps.event.addListener(marker, 'click', function() {

    infowindow.open(map, marker);

});

4. 新增InfoWindow：

var infowindow = new google.maps.InfoWindow();    //初始一個物件
infowindow.setContent('這是內容');    //InfoWindow的內容，可用Html語法
infowindow.setPosition(myLatlng);    //座標

5. 在地圖Click時新增一個Marker：

google.maps.event.addListener(map, "click", function(event) {
    marker_Click = new google.maps.Marker({
                    map: map,
                    position: event.latLng
                });
            });

6. 用地址查座標：

function getLatLngByAddr() {
    var geocoder = new google.maps.Geocoder();  //定義一個Geocoder物件
    geocoder.geocode(
        { address: '[地址]' },    //設定地址的字串
        function(results, status) {    //callback function
            if (status == google.maps.GeocoderStatus.OK) {    //判斷狀態
                alert(results[0].geometry.location);             //取得座標                                
            } else {
                alert('Error');
            }
      }
 );
}

參考：
http://itunes.apple.com/us/app/wikihow-how-to-diy-survival/id309209200?mt=8
Google Map Reference
Google Map API Tutorial

Google Map Javascript API 3的一些重點

以前在用Google Map JavaScript API v2時，在升級成v3後，有幾個比較不同的地方
要觀看教學的話，可參考 Google Map的tutorial

一、API Key
在v2時，要載入Google Map JavaScript API的函式庫前，必須先至 Google Map 開發人員網站 申請一個API Key，再用下列語法將函式庫載入：

<script type="text/javascript" src="http://maps.google.com/maps?file=api&v=2&key=[API KEY]"></script>

在v3時，只要用下列語法即可：

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=[true or false]" ></script>

要指定版本的話，加個 v 參數：

<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3&sensor=[true or false]" ></script>

省了申請API這個麻煩的事，而且v2還要再申請自已會用到的網址，每次要用新網址都要再申請，很麻煩，現在v3都省了。
後面那個sensor的參數，是在設定要不要使用定位裝置，這在寫Mobile網頁很好用，以前v2要使用的話，要加上下面這個語法：

google.load("maps", "2",{"other_params":"sensor=true"});

二、GUnload 
v2在使用時，若不想讓Client端的記憶體用一用就爆掉，就必須加上：

<body onunload="GUnload();">

讓網頁在unload時釋放資源，現在v3可省事多了，不用寫任何一段Code就會自動釋放資源，不會一直佔著你的記憶體。所以從v2改v3的朋友，可以把GUnload拿掉啦。