In our last tutorial JSON Javascript tutorial , we had covered about basics of JSON . In next couple of  posts,  we will talk about some of smart tricks and tips while using JSON.

CSS JSON

Cascading Style Sheets (CSS) is a simple mechanism for adding style (e.g. fonts, colors, spacing) to Web documents. JSON (JavaScript Object Notation) is a lightweight data-interchange format. CSS may easily be expressed in JSON notation (CSS JSON). CSS JSON is a powerful and flexible approach allowing for inheritance and logical constructs within CSS.

CSS JSON Structure

{

“selector-1″:{

“property-1″:”value-1″,

“property-n”:”value-n”

}

}

Converting CSS JSON to CSS Text with JavaScript

var cssjson = {

“selector-1″:{

“property-1″:”value-1″,

“property-n”:”value-n”

}

}

var styleStr = “”;

for(var i in cssjson){ styleStr += i + ” {\n”

for(var j in cssjson[i]){

styleStr += “\t” + j + “:” + cssjson[i][j] + “;\n”

}

styleStr += “}\n”

}

The above example returns the following CSS text format:

selector-1 {

property-1:value-1;

property-n:value-n;

}

Extending CSS with CSS JSON

Custom selector property/values can be used in CSS JSON as a mechanism to extend CSS. CSS text pre-processing is possible through the mapping of a specified property to a conditionally executed parsing routine.

CSS Selector Inheritance with CSS JSON and JavaScript

A CSS selector may be inherited within another selector using CSS JSON.

var cssjson = {

“.copy-1″:{

“font-family”:”Verdana, Geneva, Arial, Helvetica, sans-serif”,

“font-size”:”11px”,

“color”:”#CCC”

},

“div#container div#header”:{

“CSSJSON-INHERIT-SELECTOR”:”.copy-1″,

“position”:”absolute”,

“top”:”12px”,

“left”:”4px”

}

}

var styleStr = “”;

for(var i in cssjson){

styleStr += i + ” {\n”

for(var j in cssjson[i]){

if(j==”CSSJSON-INHERIT-SELECTOR”){

for(var k in cssjson[cssjson[i][j]]){

styleStr += “\t” + k + “:” + cssjson[cssjson[i][j]][k] + “;\n”

}

}else{

styleStr += “\t” + j + “:” + cssjson[i][j] + “;\n”

}

}

styleStr += “}\n”

}

The above example returns the following CSS text format:

.copy-1 {

font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;

font-size:11px;

color:#CCC;

}

div#container div#header {

font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;

font-size:11px;

color:#CCC;

position:absolute;

top:12px;

left:4px;

}

For more details refer the below link http://www.featureblend.com/css-json.html

Advantages of CSS JSON (or JSON Stylesheet)

* Forming a logical construct for the CSS classes.

* All CSS properties are stored in nested JSON objects

* CSS properties and classes can be manipulated via JavaScript

* CSS properties and classes can be dynamically set at run-time using a selector engine like jQuery

* all styling and templating can be managed client-side

GeoJSON 1.0

GeoJSON is a format for encoding a variety of geographic data structures and it can be used in the projects where the following geographic data structure is used – Point, LineString, Polygon, MultiPoint, MultiLineString, MultiPolygon, and GeometryCollection.

GeoJSON is now at version 1.0. See the finalized specification.

About GeoJSON

GeoJSON is a format for encoding a variety of geographic data structures. A GeoJSON object may represent a geometry, a feature, or a collection of features. GeoJSON supports the following geometry types: Point, LineString, Polygon, MultiPoint, MultiLineString, MultiPolygon, and GeometryCollection. Features in GeoJSON contain a geometry object and additional properties, and a feature collection represents a list of features.

GeoJSON has been adopted by more than 20 different projects, and represents more than a year of community development efforts.

For more information refer the below link

http://geojson.org/