ASPForums.Net RSS Feedhttp://www.aspforums.net/Handlers/RSS.ashxLatest additions to the content that appears on ASPForums.Net(c) 2019 www.aspforums.com. All rights reserved.Set Bar color and display average Line in Horizontal Bar chart using jQuery Flot Plugin<p>Hi <a class="username" rel="Rockstar8">Rockstar8</a>,</p> <p>Refer below code.</p> <p><strong><span style="text-decoration: underline;">HTML</span></strong></p> <pre class="brush: html">&lt;script type=&#34;text/javascript&#34; src=&#34;jquery-1.4.2.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;jquery.flot-0.8.3.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;jshashtable-2.1.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;jquery.flot.axislabels.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;jquery.numberformatter-1.2.3.min.js&#34;&gt;&lt;/script&gt; &lt;script type=&#34;text/javascript&#34;&gt; $(function () { var rawData = [{ data: [[1582.3, 0]] }, { data: [[28.95, 1]] }, { data: [[1603, 2]] }, { data: [[774, 3]] }, { data: [[1245, 4]] }, { data: [[85, 5]] }, { data: [[1025, 6]]}]; for (var i = 0; i &lt; rawData.length; i++) { if (rawData[i].data[0][0] &gt; 1500) { rawData[i].color = &#34;#1998D7&#34;; } else { rawData[i].color = &#34;#00FF00&#34;; } } var ticks = [[0, &#34;Gold&#34;], [1, &#34;Silver&#34;], [2, &#34;Platinum&#34;], [3, &#34;Palldium&#34;], [4, &#34;Rhodium&#34;], [5, &#34;Ruthenium&#34;], [6, &#34;Iridium&#34;]]; var options = { series: { bars: { show: true} }, bars: { align: &#34;center&#34;, barWidth: 0.5, horizontal: true, fillColor: { colors: [{ opacity: 0.5 }, { opacity: 1}] }, lineWidth: 1 }, xaxis: { axisLabel: &#34;Price (Rupees)&#34;, axisLabelUseCanvas: true, axisLabelFontSizePixels: 12, axisLabelFontFamily: &#39;Verdana, Arial&#39;, axisLabelPadding: 10, max: 2000, tickColor: &#34;#5E5E5E&#34;, tickFormatter: function (v, axis) { return $.formatNumber(v, { format: &#34;#,###&#34;, locale: &#34;in&#34; }); }, color: &#34;black&#34; }, yaxis: { axisLabel: &#34;Precious Metals&#34;, axisLabelUseCanvas: true, axisLabelFontSizePixels: 12, axisLabelFontFamily: &#39;Verdana, Arial&#39;, axisLabelPadding: 3, tickColor: &#34;#5E5E5E&#34;, ticks: ticks, color: &#34;black&#34; }, legend: { noColumns: 0, labelBoxBorderColor: &#34;#858585&#34;, position: &#34;ne&#34; }, grid: { hoverable: true, borderWidth: 2, backgroundColor: &#39;#FFFF76&#39;, markings: [{ xaxis: { from: 1500, to: 1500 }, color: &#34;red&#34;}] // Draw Average line. } }; $.plot($(&#39;#placeholder&#39;), rawData, options); }); &lt;/script&gt; &lt;div id=&#34;placeholder&#34; style=&#34;width: 400px; height: 300px;&#34;&gt; &lt;/div&gt;</pre> <p>&nbsp;</p>https://www.aspforums.net:443/Threads/939250/Set-Bar-color-and-display-average-Line-in-Horizontal-Bar-chart-using-jQuery-Flot-Plugin/https://www.aspforums.net:443/Threads/939250/Set-Bar-color-and-display-average-Line-in-Horizontal-Bar-chart-using-jQuery-Flot-Plugin/Wed, 04 Sep 2019 03:18:32 GMT