morris.js

morrisjs donut drawn away from center point

时光总嘲笑我的痴心妄想 提交于 2019-12-12 05:29:50
问题 Chart is drawn from start each time an option is clicked (on-click event). On first couple of times the donut is drawn correctly ie with label at center, but very often donut draws away from the center. Images are shown for both correct and faulty charts. I have hi lighted border of the div to show the position of donut. This is how it displays in view: <div id="donut_div" style="width:425px;height:325px;border:1px solid red;padding:8px;"></div> Javascript code: var neg_pts=91, pos_pts =10;

Iterating through a set Morris Donuts in ASP.NET application using jQuery and move text outside

早过忘川 提交于 2019-12-12 04:23:19
问题 TL;DR: 1. Iterate through all donuts within a Div. 2. Move label text outside the donut on mouseOver. I came across this and this questions that got me half way there, but I am trying to iterate through several donuts. I'm new to jQuery and I've tried a few options, but I just don't have a complete understanding. Here's my code. Any help would be appreciated: HTML `<div class="dials"> <div class="row"> <div class="col-md-4"> <asp:Label ID="lblSurvey1" Text="" runat="server" CssClass="page

Morris Js and Codeigniter pass data from a controller

自作多情 提交于 2019-12-12 02:48:40
问题 I have the following controller which picks data from my DBase : function chart_js() { $rows = ''; $query = "SELECT clnt_id,date_added FROM job_card ORDER BY date_added DESC LIMIT 0, 5"; $result = $this->db->query($query); $total_rows = $result->num_rows; if ($result) { $rows = $result->result_array(); } print json_encode($rows, JSON_NUMERIC_CHECK); } And passes it to json_encode in the following format : [{"clnt_id": 10, "date_added": "2015-11-02 12:28:01"}, {"clnt_id": 11, "date_added":

Changing color depending on value

戏子无情 提交于 2019-12-11 09:43:37
问题 Im working on morris js graph. The Graph is rendering, but I would like to change the colors or dots depending on values from db. I want to change color when action = buy. My JSON: [{"longdate":"2014-08-20 18:20:01","price":"1620","action":"buy"},{"longdate":"2014-08-20 18:40:01","price":"1640","action":""},{"longdate":"2014-08-20 19:00:01","price":"1620","action":""}] Morris script: $.getJSON('results.json', function(day_data) { Morris.Line({ element: 'graph', data: day_data, action: 'action

morris.js chart doesn't work on production server

强颜欢笑 提交于 2019-12-11 09:35:59
问题 I have this morris.js chart which I populated with random values (the ones provided in the exemple). Whereas it renders perfectly in localhost , once I upload on the production server it no longer works. Set up JS code new Morris.Line({ element: 'daily-chart', data: [ { y: '2006', a: 100, b: 90 }, { y: '2007', a: 75, b: 65 }, { y: '2008', a: 50, b: 40 }, { y: '2009', a: 75, b: 65 }, { y: '2010', a: 50, b: 40 }, { y: '2011', a: 75, b: 65 }, { y: '2012', a: 100, b: 90 } ], xkey: 'y', ykeys: ['a

click event on morris bar

自作多情 提交于 2019-12-11 07:30:00
问题 I implement morris graph and also working on click function but i want when i clicked on bar then data of that bar will alert.so how can get data. <!DOCTYPE html> <html> <head> <script src="http://cdnjs.cloudflare.com/ajax/libs/raphael/2.1.0/raphael-min.js"></script> <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script src="http://cdn.oesmith.co.uk/morris-0.4.1.min.js"></script> <meta charset=utf-8 /> <title>Morris.js Bar Chart Example</title> </head> <body> <div id="bar

How to create a morris.js chart from array?

这一生的挚爱 提交于 2019-12-11 06:35:32
问题 I am having an issue getting data from array to show correctly in a morris.js chart. As you can see from this snippet only the last object is output on chart: Example: var months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]; var dates = ['2015-01','2016-01','2016-03']; var valueA = ['10','30','60']; var valueB = ['100','50','70']; var z=0; for (tot=dates.length; z < tot; z++) { var myArray = [{'d': dates[z], 'a': valueA[z], 'b': valueB[z]}]; } Morris

morris.js dashed grid lines

断了今生、忘了曾经 提交于 2019-12-11 05:07:32
问题 I am trying to customize the grid lines for morris.js to have a dashed style similiar to the revenue graph in http://dribbble.com/shots/947782-Freebie-PSD-Flat-UI-Kit/attachments/107093, Is this even possible? It seems that the documentation is not very complete, gridLineColor is not listed as an option yet it does change the color when I add it to my graph. Morris.js seemed to be highly recommended but I cant seem to adjust simple things like this. I would also like to have each grid line

How to display count value of each category of Y axis in a graph using Morris.Bar function?

雨燕双飞 提交于 2019-12-11 04:27:53
问题 I am displaying data in graphical format and I am using Morris.Bar function in my cshtml page. The Y axis has categories namely: Performance, Maintainability, Others, Portability, Reliability and Security. I am using the following function: Morris.Bar({ element: 'category-bar-chart', data: JSON.parse(''[{"y":"Performance","a":23},{"y":"Maintainability","a":106},{"y":"Others","a":98},{"y":"Portability","a":27},{"y":"Reliability","a":87},{"y":"Security","a":14}]'),'), xkey: 'y', ykeys: ['a'],

how to animate morris bar chart?

自闭症网瘾萝莉.ら 提交于 2019-12-11 02:53:43
问题 I am trying to animate morris bar chart, morris bar chart got displayed but I want animation and different colour for each bar. And my code is: success:function(response){ $('body').css('cursor', 'default'); if(response.status == 'success'){ var productValueCountList=response.productcountlist; $('#productCount-bar').empty(); if(productValueCountList=='') {vex.dialog.alert("No record found") return false; } Morris.Bar({ element: 'productCount-bar', data:productValueCountList, xkey: