igFinancialChart sample

by georgianastasov

HTML

<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.dv.js"></script>
<script src="https://igniteui.com/js-data/Data"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/modules/infragistics.ui.chart.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/modules/infragistics.ui.financialchart.css" rel="stylesheet"></link>

<div id="chart" style="width:98%;height:400px"></div>
<button id="btnGet" style="margin:1rem;">Get ChartType</button>

JavaScript

$(function () {
            //data
            var data = PriceData.AMZN();
            
            //initialize igFinancialChart
            $("#chart").igFinancialChart({
                dataSource: data,
                chartType: "bar",
                zoomSliderType: "bar"
            });
            
            //get chartType
            $("#btnGet").igButton({
                labelText: $("#btnGet").val(),
                click: function (e)
                {
                		console.log('Get chartType:');
                    console.log($("#chart").igFinancialChart("option", "chartType"));
                }
            });
        });