The prototype object is used when you want to add a custom property or method to an object and want the changes to be reflected in _all_ the instances of it.
example.MyTable.prototype.draw = function(data, options) ... Without the prototype object the function draw will only apply to that particular object. However the goal is to make the draw method exist in all instances of MyTable. In short, it is the JavaScript way of doing class members, methods and inheritance. -- Rune V. Sjøen You always pass failure on the way to success On Tue, Dec 1, 2009 at 1:32 AM, codingGirl <[email protected]>wrote: > I am not a Javascript ninja so this might be a lack of knowledge but > that about the 'prototype' objects used in > http://code.google.com/apis/visualization/documentation/dev/index.html > ? > > Every class-method has a prototype in its name. What does it do? Can I > omit it? > > // Declare a unique namespace. > var example = {}; > > // Class constructor. Parameter container is a DOM elementon the > client that > // that will contain the visualization. > example.MyTable = function(container) { > this.containerElement = container; > } > > // Main drawing logic. > // Parameters: > // data is data to display, type google.visualization.DataTable. > // options is a name/value map of options. Our example takes one > option. > example.MyTable.prototype.draw = function(data, options) { > > // Create an HTML table > var showLineNumber = options.showLineNumber; // Boolean > configuration option. > > var html = []; > html.push('<table border="1">'); > > // Header row > html.push('<tr>'); > if (showLineNumber) { > html.push('<th>Seq</th>'); > } > for (var col = 0; col < data.getNumberOfColumns(); col++) { > html.push('<th>' + this.escapeHtml(data.getColumnLabel(col)) + '</ > th>'); > } > html.push('</tr>'); > > for (var row = 0; row < data.getNumberOfRows(); row++) { > html.push('<tr>'); > if (showLineNumber) { > html.push('<td align="right">', (row + 1), '</td>'); > } > > for (var col = 0; col < data.getNumberOfColumns(); col++) { > html.push(data.getColumnType(col) == 'number' ? '<td > align="right">' : '<td>'); > html.push(this.escapeHtml(data.getFormattedValue(row, col))); > html.push('</td>'); > } > html.push('</tr>'); > } > html.push('</table>'); > > this.containerElement.innerHTML = html.join(''); > } > > // Utility function to escape HTML special characters > example.MyTable.prototype.escapeHtml = function(text) { > if (text == null) > return ''; > return text.replace(/&/g, '&').replace(/</g, '<') > .replace(/>/g, '>').replace(/"/g, '"'); > } > > -- > > You received this message because you are subscribed to the Google Groups > "Google Visualization API" group. > To post to this group, send email to > [email protected]. > To unsubscribe from this group, send email to > [email protected]<google-visualization-api%[email protected]> > . > For more options, visit this group at > http://groups.google.com/group/google-visualization-api?hl=en. > > > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.
