Data Warehousing and Analytics Infrastructure at Facebook
http://borthakur.com/ftp/sigmodwarehouse2010.pdf
What is Facebook’s architecture?
http://www.quora.com/What-is-Facebooks-architecture
New Bundling and Minification Support
Excellent new feature…
Read it here
Using Web Service to render asp.net chart
Using Javscript webservices, it’s easy to render Chart image.
1. Create a webservice to get chart image
[WebMethod(EnableSession=true)]
public string SupplierPLCategory(string type, string charttype, int from, int to)
{
var sessionUser = HttpContext.Current.Session["User"];
if (sessionUser != null)
{
Data.DTO.User user = sessionUser as Data.DTO.User;
int scenarioid = Convert.ToInt32(HttpContext.Current.Session["ScenarioID"]);
int countryid = Convert.ToInt32(HttpContext.Current.Session["CountryID"]);
List<Filter> filters = new List<Filter>();
filters.Add(new Filter() { Column = EnumModel.WidgetVariable.From, Value = from });
filters.Add(new Filter() { Column = EnumModel.WidgetVariable.To, Value = to });
filters.Add(new Filter() { Column = EnumModel.WidgetVariable.ChartType, Value = charttype });
filters.Add(new Filter() { Column = EnumModel.WidgetVariable.Display, Value = type });
filters.Add(new Filter() { Column = EnumModel.WidgetVariable.Country, Value = countryid });
filters.Add(new Filter() { Column = EnumModel.WidgetVariable.Scenario, Value = scenarioid });
filters.Add(new Filter() { Column = EnumModel.WidgetVariable.UserID, Value = user.ID });
return ViewManager.RenderView(“~/Controls/Reports/SupplierPLCategoryData.ascx”, filters);
}
return “error”;
}
Here viewmanager is a simple class which create a object of system.web.ui.page at run time and adds the controls
to it to execute and get the resultant HTML.
public class ViewManager
{
public static string RenderView(string path)
{
return RenderView(path, null);
}
public static string RenderView(string path, object data)
{
Page pageHolder = new Page();
UserControl viewControl = (UserControl)pageHolder.LoadControl(path);
if (data != null)
{
Type viewControlType = viewControl.GetType();
FieldInfo field = viewControlType.GetField(“ObjectData”);
if (field != null)
{
field.SetValue(viewControl, data);
}
else
{
throw new Exception(“View file: ” + path + ” does not have a public Data property”);
}
}
pageHolder.Controls.Add(viewControl);
StringWriter output = new StringWriter();
HttpContext.Current.Server.Execute(pageHolder, output, false);
return output.ToString();
}
}
2. Create a user control to bind chart
public object ObjectData;
public void Fill()
{
if (ObjectData != null)
{
int scenarioId = 0;
string type=string.Empty ; string chartType=string.Empty ; int from=0; int to=0;
int userId = 0;
int countryId = 0;
List<Filter> filters = ObjectData as List<Filter>;
countryId = Convert.ToInt32(filters.Where(c => c.Column == EnumModel.WidgetVariable.Country).SingleOrDefault().Value);
scenarioId = Convert.ToInt32(filters.Where(c => c.Column == EnumModel.WidgetVariable.Scenario).SingleOrDefault().Value);
userId = Convert.ToInt32(filters.Where(c => c.Column == EnumModel.WidgetVariable.UserID).SingleOrDefault().Value);
type =filters.Where(c => c.Column == EnumModel.WidgetVariable.Display).SingleOrDefault().Value.ToString();
chartType= filters.Where(c => c.Column == EnumModel.WidgetVariable.ChartType).SingleOrDefault().Value.ToString();
from =Convert.ToInt32( filters.Where(c => c.Column == EnumModel.WidgetVariable.From).SingleOrDefault().Value.ToString());
to = Convert.ToInt32(filters.Where(c => c.Column == EnumModel.WidgetVariable.To).SingleOrDefault().Value.ToString());
// fill chart here
}
}
In control’s HTML, just drag a chart control and create the required series and set the properties according to your requirements
3. Calling code is written in Asp.net Ajax but you can use Jquery if you would like to
function GetSupplierPLCategory(type, charttype, from, to) {
retailInsight.ProfitModel.Web.UI.Widgets.SupplierPLCategory(type,charttype, from ,to,
function (result) {
$get(“contents_pl_category”).innerHTML = result;
});
}
Waterfall using asp.net chart control
Designing a waterfall chart using asp.net charting control is a bit trick as it doesn’t support Waterfall series type. But we can do it by using RangeColumn series type and bit of code.
Step 1:
Drop a asp.net chart control on page with having a series of RangeColumn type.
Step 2 :
Next step is to add data points to your chart and make it to look like waterfall chart. RangeColumn series type provides a way to add your Y-Axis value in a range, you can specify your starting and ending values for a data point like this:
Adding a first point
cWaterfall.Series[0].Points.AddXY("First Item", new object[] { 0, 500 });
cWaterfall.Series[0].Points[0].Label = "500"
cWaterfall.Series[0].Points[0].Color = Color.SkyBlue;
Adding a second point
cWaterfall.Series[0].Points.AddXY("Second Item", new object[] { 500, 700 });
cWaterfall.Series[0].Points[1].Label = "200"
cWaterfall.Series[0].Points[1].Color = Color.Green;
By using the above approach you can create a waterfall chart like this
Calling web service using jQuery
html
<input type =”text” id=”name” />
<input type =”button” id=”btn” value=”click me” />
<div id=”test”> </div>
JS
$(document).ready(function () {
$('#btn').click(function (event) {
$.ajax({
type: "POST",
url: "WebService.asmx/LoadControl",
data: "{'name': '" + $('#name').val() + "' }",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (msg) {
AjaxSucceeded(msg);
},
error: AjaxFailed
});
});
function AjaxSucceeded(result) {
$('#test').html(result.d);
}
function AjaxFailed(result) {
$('#test').html(result.status + ' ' + result.statusText);
}
});
Web Service
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class WebService : System.Web.Services.WebService {
public WebService () {
[WebMethod]
public string LoadControl(string name)
{
return ViewManager.RenderView("Test.ascx");
}}
View Manager
public class ViewManager
{
public static string RenderView(string path)
{
return RenderView(path, null);
}
public static string RenderView(string path, object data)
{
Page pageHolder = new Page();
UserControl viewControl = (UserControl)pageHolder.LoadControl(path);
if (data != null)
{
Type viewControlType = viewControl.GetType();
FieldInfo field = viewControlType.GetField("Data");
if (field != null)
{
field.SetValue(viewControl, data);
}
else
{
throw new Exception("View file: " + path + " does not have a public Data property");
}
}
pageHolder.Controls.Add(viewControl);
StringWriter output = new StringWriter();
HttpContext.Current.Server.Execute(pageHolder, output, false);
return output.ToString();
}
}
Image gallery in asp.net
There are plenty of solutions to create image gallery in asp.net and here is one of them which I use.
Step 1: create a httpHandler to generate thumbnails on the fly
<%@ WebHandler Language="C#" Class="Thumbnail" %>
using System;
using System.Drawing;
using System.Drawing.Drawing2D;
using System.Drawing.Imaging;
using System.IO;
using System.Text.RegularExpressions;
using System.Web;
public class Thumbnail : IHttpHandler {
private Regex _nameValidationExpression = new Regex(@"[^\w/]");
private int _thumbnailSize = 150;
public void ProcessRequest(HttpContext context) {
string photoName = context.Request.QueryString["p"];
//if (_nameValidationExpression.IsMatch(photoName)) {
// throw new HttpException(404, "Invalid photo name.");
//}
string cachePath = Path.Combine(HttpRuntime.CodegenDir, photoName + ".square.png");
if (File.Exists(cachePath)) {
OutputCacheResponse(context, File.GetLastWriteTime(cachePath));
context.Response.WriteFile(cachePath);
return;
}
string photoPath = context.Server.MapPath("~/Files/CBPLibrary/" + photoName );
Bitmap photo;
try {
photo = new Bitmap(photoPath);
}
catch (ArgumentException) {
throw new HttpException(404, "Photo not found.");
}
context.Response.ContentType = "image/png";
int width, height;
if (photo.Width > photo.Height) {
width = _thumbnailSize * photo.Width / photo.Height;
height = _thumbnailSize;
}
else {
width = _thumbnailSize;
height = _thumbnailSize * photo.Height / photo.Width;
}
Bitmap target = new Bitmap(_thumbnailSize, _thumbnailSize);
using (Graphics graphics = Graphics.FromImage(target)) {
graphics.CompositingQuality = CompositingQuality.HighSpeed;
graphics.InterpolationMode = InterpolationMode.HighQualityBicubic;
graphics.CompositingMode = CompositingMode.SourceCopy;
graphics.DrawImage(photo, (_thumbnailSize - width) / 2, (_thumbnailSize - height) / 2, width, height);
using (MemoryStream memoryStream = new MemoryStream()) {
target.Save(memoryStream, ImageFormat.Png);
OutputCacheResponse(context, File.GetLastWriteTime(photoPath));
using (FileStream diskCacheStream = new FileStream(cachePath, FileMode.CreateNew)) {
memoryStream.WriteTo(diskCacheStream);
}
memoryStream.WriteTo(context.Response.OutputStream);
}
}
}
private static void OutputCacheResponse(HttpContext context, DateTime lastModified) {
HttpCachePolicy cachePolicy = context.Response.Cache;
cachePolicy.SetCacheability(HttpCacheability.Public);
cachePolicy.VaryByParams["p"] = true;
cachePolicy.SetOmitVaryStar(true);
cachePolicy.SetExpires(DateTime.Now + TimeSpan.FromDays(365));
cachePolicy.SetValidUntilExpires(true);
cachePolicy.SetLastModified(lastModified);
}
public bool IsReusable {
get {
return true;
}
}
}
The above code creates a thumbnail from image and cache it in asp.net temporary files directory.
Step 2: The next task is to show images and then create a popup that displays the actual image on thumbnail click
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("a[rel=gallery]").fancybox({
'transitionIn': 'elastic',
'transitionOut': 'elastic',
'easingIn': 'easeOutBack',
'easingOut': 'easeInBack'
});
});
</script>
The above script is using the fancy box jquery plugin to display actual image.
Step 3: Create html to show thumbnail images
<a rel=”gallery” href=”../files/cbplibrary/382c3379-1.jpg”>
<img src=”../Thumbnail.ashx?p=382c3379-1.jpg” alt=”" />
</a>
Update multiple records in one sql statement
UPDATE eventforecast
SET uplift= x.uplift
FROM eventforecast
JOIN
(
SELECT uplift,id from eventforecast
UNION
SELECT uplift,id from eventforecast
UNION
SELECT uplift,id from eventforecast
) x ON eventforecast.id = x.id
Setup ELMA to asp.net 3.5 website
ELMA is an open source tool to log, display and email errors. It supports In-Memory, SQL and XML data stores to store errors.
To Configure it in your website
1. Download the latest dll from http://code.google.com/p/elmah/ and place it in bin folder of your application.
2. Add following configurations to your website’s web.config or machin.config if you want to enable it for all websites.
<configSections>
<sectionGroup name="elmah">
<!-- NOTE! If you are using ASP.NET 1.x then remove the
requirePermission="false" attribute from the section
elements below as those are only needed for
partially trusted applications in ASP.NET 2.0 -->
<section name="security" requirePermission="false" type="Elmah.SecuritySectionHandler, Elmah"/>
<section name="errorLog" requirePermission="false" type="Elmah.ErrorLogSectionHandler, Elmah" />
<section name="errorMail" requirePermission="false" type="Elmah.ErrorMailSectionHandler, Elmah" />
<section name="errorFilter" requirePermission="false" type="Elmah.ErrorFilterSectionHandler, Elmah"/>
</sectionGroup>
</configSections>
<elmah>
<security allowRemoteAccess="true" />
<!--
Use to log errors into separate XML files that are stored on
disk at the path specified in the logPath attribute.
-->
<errorLog type="Elmah.XmlFileErrorLog, Elmah" logPath="~/App_Data" />
</elmah>
<system.webServer>
<validation validateIntegratedModeConfiguration="false" />
<modules>
<add name="Elmah.ErrorLog" type="Elmah.ErrorLogModule, Elmah" preCondition="managedHandler" />
<add name="Elmah.ErrorFilter" type="Elmah.ErrorFilterModule" preCondition="managedHandler" />
<add name="Elmah.ErrorMail" type="Elmah.ErrorMailModule" preCondition="managedHandler" />
</modules>
<handlers>
<add name="Elmah" path="elmah.axd" verb="POST,GET,HEAD" type="Elmah.ErrorLogPageFactory, Elmah" preCondition="integratedMode" />
</handlers>
</system.webServer>
Watermark using jQuery
function setWatermark() {
$(document).ready(function() {
$(".watermark").each(function() {
var hnt = $(this).attr("hint");
var value = $(this).val();
if (value == "")
$(this).val(hnt);
});
$(".watermark").focus(function() {
var hnt = $(this).attr("hint");
var value = $(this).val();
if (value == hnt)
$(this).val("").removeClass("watermark");
});
$(".watermark").blur(function() {
var hnt = $(this).attr("hint");
var value = $(this).val();
if (value == "") {
$(this).val(hnt).addClass("watermark");
}
});
});
}
