Creating Widgets

Each widget has a directive with a prefix of "wij-" that you use like an HTML element instead of the combination of HTML elements and jQuery script that we usually use to create widgets. For each widget name, we insert a dash between the wij- prefix and the name of the widget. For example, wij-grid, wij-barchart, wij-radialgauge. Here is sample markup that you can use to create a Calendar widget.

 Setting Options

For each option, we insert a dash before any camel cased letters, so that seriesList becomes series-list, maskFormat becomes mask-format.

For child options, we can nest the elements, or if it's just a simple option, it can be used as an attribute of the main element. Some examples include:

$("#calendar1").wijcalendar(
    {
        easing: "easeOutExpo"
    }
);

<wij-calendar easing="easeOutExpo"></wij-calendar>

axis:{
    x:{text:"Auto Makers"},
    y:{text:"Percent Increase in Sales", annoFormatString:"p0"}
}

<axis>
    <x text="Auto Makers"></x> 
    <y text="Percent Increase in Sales" anno-format-string="p0"></y> 
</axis>