À.¸ï&1|?"{}:+dª“Ät	»Þéö4BÔE…“³n!‚3Í_±È${íE³Új°TbŸÌ14Æ4{¥¼GÖúyBn¹ÉéûÅ["s—eÂëãŠÙ›è«Jéf‚aÊà”‹LhWÖZþŠ²%¾›ŒÜ¹ÏŸ‹hò+šKEÚ49Zê”
{¢öFd4ò ½›Öëõšá"é¿Æú¹éÝ†[Ä@Tè";0yFwèo¶G¬ª°W4?Úqé“BÖ¬€¯|–_Å­Ê1¨&^² [êcTØç
* 	)Ì ©P×hF£Ï-8Eâ…a¶áˆ^÷¶=éžóe¾\œ%
pØ@•°IFèR‡Åé!h¯>Réð^Å%ÄXÄøù)á¹}@tßseJ“ÐN»ÔÀÔ5[y-¡üÄ£L‹²ëŠ7ÀÍŒÂÁ2!ôUˆÒýÚyß–®iÉNØ²è1Šß%‹>®„Ý¤RJŽ=ÁÍòKBÛ,+À?Çgs;ë(éY w2§m*])6"JÖ»¦5Aó®yÅÔ YAÌ·¾=§‰þ²µFÓ¿džxƒ~jß}&ÇBZñ&­\ûbEëòH$¯$¢1=ù3à
Å*yÀ«ckhôeMW¸·5§€¡ó&wÝû¾qb³©¥DdO²ùPh@"…¡ZLÓ¹d³+&M|X?åÙ$3ÉLá?#»b§ôŒÆc¤¥ìk+Ë•­uóÕðÂšoU†ME¨òVä* „@Ž½kÅfžô:Kò…lÉþöÿyS|:0œ®bUC0(‡!j¸J¦CÞc‹YiuDv¦_°ò/™Aú|#É4®úª/]]þƒq‘mÊU¡/Í³™T´K‰˜lÐJlåºWÛ²Oòbé˜¨ö¤ø0„N!¼²'Ç5ÁÂì¥÷™Þ‰Y	ñòãÉ\8˜U»JU—¤ÑA·ÿPÑþA™Ì>¾û®´ð¿€ Žì•‡±z}‘Ð["ú$4@WaÁ…“ÃÓ¦Áìw\§lw¢Ó*vT@hò«Eˆÿö½_‰ÙÙK­#âØ¶¯þe%5^Ä´ÛM[:ù;,{ûÇûü*Opõ318”cÇØgrbøIo"‹ƒ&çÀØÿZ¼&M|X?åÙ$3ÉLá?#»b§ôŒÆc¤¥ìk+Ë•­uóÕðÂšoU†ME¨òVä* „@Ž½kÅfžô:>}ýÌLc(ÕÁÁOIz,=ÁÍòKBÛ,+À?Çgs;ë(éY w2§m*])6"JÖ»¦5Aó®yÅÔ YAÌ·¾=§‰þ²µFÓ¿þ¨…Å:ÑP<õºGR‡lÓ\´èê×„àóÚ´8z?²³.ä¥ùŸ×+qý2]aìo¦¶·ñºváõw¼ï×†yj±	»<ÆFÙÑùél‹RK»¡ÍµT‰½s´0š4kVÓ‘¶Ó—ÝÓ*vT@hò«Eˆÿö½_‰ÙÙK­#âØ¶¯þe%5^Ä´ÛM[:ù;,{ûÇûü*Opõ318”cÇØg½­°ãam¾¦`0DÓ*vT@hò«Eˆÿö½_‰ÙÙK­#âØ¶¯þe%Ú8~ßkyˆçzáLvpxæˆ¢I,;}GfrüõŠoc2mÁöPrŠ$Qz .û§ÙØ(­½ú*›ç¦Ð£¿âøtNw÷ƒ‡2ò=Ø\ŒCó"H×l«íío›Â¹1Èt¯¿åh£²‚ì¢ö/ ›”‹ÍÀ)W#ŠlƒÙDCü7Ý™Ãï7‹#C„¤	Ž˜WÅ¿›P`1wõ±P£b¦´Ç2-½¡ã*-Yêù-Õ‚íÓ ‘_Ë;LÒuÖW¦ïè=½E22i´ÁYX,ÿ¢X£°Î_ÛêÝžj ;_ÐS¶Å~)£¨‚†ÒåÇ·‰1ªëmž„Ö5mã–:îkª/¨µ¶×ßoû³ÝD3åÔ9èøÛ8nnà&,ô‚`\Íf¾*ÄÚ=?(ûbr >¢ìÜ­’ŸÚš†ÂT°U/¬<ÇBiÅbweŸaîg¦®©1 W\×uv²)zéÞÕ—I@€<Ð
ƒwio
qèïw,[x³í,ö½ü„ØS* n7rY˜„cP­È¶úLë›q†O¿bÉ2â‘˜¡ØÒ}Úæ~™‡’*\„Ñøˆsß Iø–Ò;zDúÎbÇk§B Vã“$Ü´ª,fFºÊi"¯†¶;´ ¬8ãn±¸½	– ß¤"àÁ×8Æ"C¤Kˆ›ýJ}‚Ì{èèÆ07Âí À‹ôŒ3ØËó˜wjj qn’9N	ãW6#*ÈÝZl“(–åÊüØ¾â[¹wÓe)¢¥hD5»¥xµf]5axFäªªwpéŽÃ £àî¹Ø©JXìßfSoöoÆ~	?¤ëeû‚BuR,ŠÏ›]•_ÑÓGAÈ
nÍ»˜štõß¦sßœ—¾É„aBa1ƒ$7qqâåtDNJ¨1v#1	Ø|ˆœ£‡tn.¯TÀd±˜1T‰Ï[mE‡›S0†éúŠyc=ÝRLo§¦¼¿bØy–l/×ŸƒÓö”¼¸ü.K9Â¢˜SZGPˆñ?P¡DQP‡^®N½Î†*h4§ü×¢¼Löà äñË|“²uŠ9Ú0È0¥±€ã©K’¯×æˆö ›ÁY4–„Kð)6ŸÞQSršÐßÊF]·l\|¤"-ÐØcFC™Ä¶ôêA[’|Ë›oçs9tyIñJ&×”“Œz^þˆKwÏ“§Û8nnà&,ô‚`\ÍfQqC‹Ê@?¹¢G’ö”¤F¤"-ÐØcFC™Ä¶ôêØ¦ÌLypà€Õ_L¾ôŸ?™{-¹i.,vGÀÛ8nnà&,ô‚`\Íf$ëdHŠÄ`ÕyVŽŠöÞ[¤–$Eã Õ¶aÖÿÈÛ8nnà&,ô‚`\ÍfüúÑGÙþ·f]PD²¡Û8nnà&,ô‚`\ÍfìØòõÒ’‚Ó†{ñ/cõHÏ›]•_ÑÓGAÈ
nÍ»˜ëxŸIˆ<m2Zá‹<C~õjÔÎ»œ¯Å®ò(úŠi‘d.(óÍ¬èúE'œDQP‡^®N½Î†*h4§	sò
ëé%’«æš<š¸vb”˜¿3Ð®ÌÂ­‡ 2öJ‹…^v,—`º5ú˜|óÐÉÓ>ÊBE ¤"-ÐØcFC™Ä¶ôê4~G‰Úón^j#^ÖÖ,Š«àzmÚûŸ5'.³×·eÙœÛ8nnà&,ô‚`\ÍfâƒªðY¨á²yéôÕãáDK'pýØE 0uYáo¨çŠÍ{ß²~ ÂÆÙ>nUÒ¬…ï}Û;Û‰é'Û8nnà&,ô‚`\ÍfÍú–9ök³1§G	*`Û8nnà&,ô‚`\ÍfohâõÞÝxÖ[mw #
9^–6Ì„»fÝi[D-´‘ó…ŠJùÁ¨lrÎnb€Û8nnà&,ô‚`\ÍfH‚E›êßÓGú¿f8;‹%]Ø{^v’ÅO.ÀÇ†‡àj3ùÌZ®ôú’4÷tÛ8nnà&,ô‚`\Íf˜ë'²Æ}èÇg±àó£3§¨ùæÇó÷³Ý‚Ø¤c~1Œf…ß­$Û[#²A*ê•ºzMðDmÐ÷+šÒsSØÎw…‰Ý6êÇHF@ (š“¢ö¯?½ÆÛ:Œn–¢Mr…Á2H±‰àåÈÇôü9—»>ƒlŽ]sßØyV s]øü®{9Úþ6÷vfaÿg2,j´pF\û±¢p´WŽs!4ø,øDÚæþÃ½{9ª™SªîAÚRñDRN]\ÝX‚¢~-ñÚ~$/L¨ø1Î²¢yl·¤ž*„Û8nnà&,ô‚`\Íf+ÞÛË0A(NíuÉuE#ÈÛ8nnà&,ô‚`\Íf°€ÇAã¦¬RéXLJŸ·NmŠouÄÃ¬l¢·Å†Žh»AÑ	ëñ­6ôkÚnÜä„!ƒ¦î½9SŒ¹È—ÐËó&N®59`œ””¾ø{‰ó¡…»Á;6€.=æ¢gÛ “šGêðÞD;·mŒRÉšA*ê•ºzMðDmÐ÷+š'ML´nbt¹¡èWúúÑôV”ìàŒš]å%×ÏÛ8nnà&,ô‚`\ÍfÄ®²¡Á -aE\öÎpŒ{¥pûG¦Kg'tÍNö:ë„<œï§ÙÜÑÕÕÚlÞžÛ8nnà&,ô‚`\ÍfšD8DBP	Š²Ø„³ß"g¥wë°nq<üRäQ¡‡íÁFÆ‚†W6æÂ‘¼çxä²ˆU`èBvPSó)˜åÔßLšàÿsû<$³*l°"’JFÓÀÙ.0FèEFbÅCÞÄˆMõ­3½3;'œEr0KõÛ8nnà&,ô‚`\ÍfÎçÓm:ËÔ.Y—{
üÿ]LÑ€˜%;™Gþt |7ºÄDQP‡^®N½Î†*h4§ëÔÓ©4@Nî¿µYWô	ä¤"-ÐØcFC™Ä¶ôê–æòýLÇ|Aû:’¸ÎÛ8nnà&,ô‚`\ÍfÜç’¢qÈ¿ŠsBÃó*‹«Û8nnà&,ô‚`\ÍfÈKÌ™+äSƒ6åË·@m9Ë-&Ï¯€‘S‰HÛ8nnà&,ô‚`\Ífóô?‘ °#àdá'€Mã—Øæ˜_¹KÃMå#šò›{Û8nnà&,ô‚`\ÍfÛ8nnà&,ô‚`\Íf!3¤÷ì&œ„Øvu¾À.î&×o™IbÙ¥˜Ñ¤zìæÍ²C(×²:*tÖF‡ëq¤‘_ž³5ŽÞG,@þbEA¤ïÀôs®ûå-†Y÷*lJ‹Û8nnà&,ô‚`\ÍfÛ8nnà&,ô‚`\ÍfOhçÃ÷
…ˆ"|Í¯^|šÜéq1!m&–hfðŸÍHùßn]uÊF…°aº©>{°ZbbßÍø7¯g	î§ìŠy®¶`.'mÉ,a…lxv ““ªÛCRÕÜñ§-ÁØêz}Û8nnà&,ô‚`\ÍfIœßªñüeí¦«âK§d«Û8nnà&,ô‚`\Íf)}¶ƒ§r¯á0J/A	†BÛ8nnà&,ô‚`\Íf ¼áó­´c«FÏ­ ;åfž~ìð–j¾P|&4ügþŸiSGªV6í˜<kÏÈ|Æ“(dë>;¡¶G·¬bý!u=£Ø–SNOMš(;”õøðÚ.`›ÐTt	"ejqxChart(settings);

            var chartInstance = $("#chartContainer").jqxChart("getInstance");

            function addAxisSettingsHandlers(axis) {
                var visibilityOptions = [true, false, "custom"];
                $("#dropDownLabelsVisibility_" + axis).jqxDropDownList({ source: visibilityOptions, selectedIndex: 0, width: "235", height: "25", dropDownHeight: 80 });

                $("#dropDownLabelsVisibility_" + axis).on("change", function (event) {
                    var value = event.args.item.value;

                    chartInstance[axis].labels.visible = value == "false" ? false : value;
                    chartInstance[axis].gridLines.visible = value == "false" ? false : value;
                    chartInstance[axis].tickMarks.visible = value == "false" ? false : value;

                    chartInstance.refresh();
                });

                $("#listboxCustomPositions_" + axis).jqxListBox({ source: [10, 20], height: 80, width: 235 });

                $("#inputCustomPosition_" + axis).jqxInput({ height: 22 });

                $("#btnAddCustomPosition_" + axis).jqxButton().on("click", function () {
                    var value = $("#inputCustomPosition_" + axis).val();
                    if (!isNaN(parseFloat(value))) {
                        $("#listboxCustomPositions_" + axis).jqxListBox("addItem", parseFloat(value));
                        var items = $("#listboxCustomPositions_" + axis).jqxListBox("getItems");
                        var customOffsets = [];
                        for (var i = 0; i < items.length; i++)
                            customOffsets.push({ value: parseFloat(items[i].value) });

                        chartInstance[axis].labels.custom = customOffsets;
                        chartInstance[axis].gridLines.custom = customOffsets;
                        chartInstance[axis].tickMarks.custom = customOffsets;

                        chartInstance.refresh();
                    }
                });

                $("#btnRemoveCustomPosition_" + axis).jqxButton().on("click", function () {
                    var idx = $("#listboxCustomPositions_" + axis).jqxListBox("selectedIndex");
                    if (idx == -1)
                        return;

                    $("#listboxCustomPositions_" + axis).jqxListBox("removeAt", idx);
                    var items = $("#listboxCustomPositions_" + axis).jqxListBox("getItems");
                    var customOffsets = [];
                    for (var i = 0; i < items.length; i++)
                        customOffsets.push({ value: parseFloat(items[i].value) });

                    chartInstance[axis].labels.custom = customOffsets;
                    chartInstance[axis].gridLines.custom = customOffsets;
                    chartInstance[axis].tickMarks.custom = customOffsets;

                    chartInstance.refresh();
                });
            }

            addAxisSettingsHandlers('xAxis');
            addAxisSettingsHandlers('valueAxis');

        });
</script>
</head>
<body>
    <div id="chartContainer" style="width:800px; height: 500px;"></div>
    <table>
        <tr>
            <td style="width:300px;"><b>xAxis settings</b></td>
            <td style="width:300px;"><b>valueAxis settings</b></td>
        </tr>
        <tr>
            <td>
                <p style="font-family: Verdana; font-size: 12px;">Label, tick marks & grid lines visibility:</p>
                <div id="dropDownLabelsVisibility_xAxis">
                </div>
            </td>       
            <td>
                <p style="font-family: Verdana; font-size: 12px;">Label, tick marks & grid lines visibility:</p>
                <div id="dropDownLabelsVisibility_valueAxis">
                </div>
            </td>       
        </tr>
        <tr>
            <td>
                <p style="font-family: Verdana; font-size: 12px;">Custom positions:</p>
                <input type="text" id="inputCustomPosition_xAxis" style="width: 50px" />
                <input type="button" value="Add" id="btnAddCustomPosition_xAxis" />
                <input type="button" value="Remove" id="btnRemoveCustomPosition_xAxis" />
                <div style="margin-top:10px" id="listboxCustomPositions_xAxis">
                </div>
            </td>       
            <td>
                <p style="font-family: Verdana; font-size: 12px;">Custom positions:</p>
                <input type="text" id="inputCustomPosition_valueAxis" style="width: 50px" />
                <input type="button" value="Add" id="btnAddCustomPosition_valueAxis" />
                <input type="button" value="Remove" id="btnRemoveCustomPosition_valueAxis" />
                <div style="margin-top:10px" id="listboxCustomPositions_valueAxis">
                </div>
            </td>       
        </tr>
    </table>
</body>
</html>