Tag: chart

增加Anychart散点图中特定标记点的大小

我正在使用AnyChart创建散点图 anychart.onDocumentReady(function () { var data_1 = [[“1”, “82”], [“1”, “90”], [“1”, “78”], [“1”, “86”], [“1”, “86”], [“1”, “88”], [“1”, “86”], [“2”, “87”], [“2”, “90”], [“2”, “87”], [“2”, “90”], [“2”, “67”], [“2”, “90”], [“2”, “77”], [“3”, “82”], [“3”, “96”], [“3”, “82”], [“3”, “80”], [“3”, “93”], [“3”, “67”], [“3”, “87”], [“4”, “66”], [“4”, “91”], [“4”, “71”], […]

用于甘特图表的JavaScript / jQuery库

我需要创建一个堆积条形图,显示一天中的引擎状态。 以下是我想要的例子: 它看起来像甘特图,但可能比普通的甘特图简单得多。 我很难找到支持这种图表的JavaScript / jQuery图表库。 我知道很多甘特图库,但想知道哪个库有我想要的图表的选项/设置。 我的数据将采用以下格式: [ { “day”: “2009-07-13”, “work”: [“11:16:35-12:03:12”, “12:32:48-13:26:28”, “13:39:09-13:39:12”, “13:41:03-13:41:05”, “14:18:09-24:00:00”] }, { “day”: “2009-07-14”, “work”: [“00:00:00-07:22:25”, “07:22:25-07:22:28”, “10:10:04-10:10:31”, “10:10:32-10:15:33”, “10:18:07-10:21:19”, “11:04:49-11:06:15”, “11:12:50-11:19:05”, “11:19:11-11:19:19”, “11:45:50-11:51:42”, “11:51:43-11:53:55”, “14:03:13-14:13:04”, “14:23:55-14:31:28”, “14:31:28-14:38:00”, “14:38:00-14:49:04”, “16:34:56-16:44:33”, “16:46:37-16:48:10”, “16:48:11-24:00:00”] }, { “day”: “2009-07-15”, “work”: [“00:00:00-08:16:23”, “09:57:57-10:15:05”] }, { “day”: “2009-07-16”, “work”: [“10:02:40-10:05:56”, “10:07:16-10:09:26”, “10:09:27-10:09:28”, […]

flot charts – 外部选择栏

我正在使用flot http://code.google.com/p/flot/,并希望在用户将鼠标hover在链接上时突出显示该系列中的特定栏,有人知道该怎么做吗? 干杯, 蒂姆

数据标签未显示Highcharts

我正在尝试显示数据标签。 但是DATALABEL没有显示黑条。 为什么? http://jsfiddle.net/o4pt855e/ 其他酒吧显示得很好。 我借此机会问我怎样才能提出一个条件? 如果该值小于5,则DATALABEL显示在左侧,否则显示在右侧。 $(function () { $(‘#container’).highcharts({ chart: { type: ‘bar’ }, title: { text: ‘Mi EPS’ }, xAxis: { //categories: [“number1”, “number2”, “number3”, “number4″,”number5”], title: { text: null }, labels: { // align: ‘center’, x: -5, y: -20, useHTML: true, format: ‘ my labelL is very large ***************************************this in other […]

AngularJS选项卡中的Highcharts动态(重新)大小调整

我的应用程序在各种选项卡中显示HighCharts图表(使用AngularJS)。 请注意, 每次选择选项卡时都会动态重新生成图表(意味着每次 Angular“删除或重新创建DOM树的一部分”)。 我的问题是, 只有在我第一次点击选项卡时 ,图表的大小才是正确的 。 当我切换标签时,创建的图表大大超过了其容器的大小。 令人惊讶的是,在调整窗口大小(即调用chart.reflow()时chart.reflow()后,图表会正确resize。 所以我尝试了以下,但没有帮助: $(element).highcharts({ chart: { type: ‘scatter’, zoomType: ‘xy’, events: { load: function () { this.reflow(); } } }, … 最后,以下确实有效,但感觉就像是黑客。 $(element).highcharts({ chart: { type: ‘scatter’, zoomType: ‘xy’, events: { load: function () { var chart = this; setTimeout(function () { chart.reflow(); }, 0); } } […]

使用Chartist.js如何更改圆环图的笔画颜色?

您好我想使用Chartist.js创建以下圆环图: 目标图表 这就是图表目前的样子: Chartist.js甜甜圈图表 我试图找到我可以在哪里或如何更改此图表的颜色以匹配第一个圆环图。 红色和粉红色似乎是默认值。 我无法找到有关如何实现此目标的任何文档。 我还想自定义笔画的大小和图表本身的大小。 任何帮助是极大的赞赏! 当前代码: // ** START CHARTIST DONUT CHART ** // var chart = new Chartist.Pie(‘.ct-chart’, { series: [70, 30], labels: [1, 2] }, { donut: true, showLabel: false }); chart.on(‘draw’, function(data) { if(data.type === ‘slice’) { // Get the total path length in order to use for […]

使用chart.js在圆环图中心的事件处理程序

我在一个页面上创建了4个圆环图,中间有一些文本,我知道这可以通过在中心放置DIV来完成,但我不能使用它,因为当图表下载为PNG时文本不会被导出: 演示: https : //jsfiddle.net/cmyker/ooxdL2vj/ 我需要跟踪中心文本的单击,我尝试使用pageX,pageY来确定是否在中心部分进行了单击。 坐标是矩形部分的角,它位于圆环图的中心孔内,并且可能有文本。 jQuery(‘#canvas’).on(‘click’,function(e){ var pageX = e.pageX; var pageY = e.pageY; if((pageY >= 379 && pageY = 440 && pageX <= 629)){ //coordinates are of rectangular area which has text inside the center of doughnut chart. //do something } }); 但如果屏幕的分辨率不同,这将不起作用,因为坐标会有所不同。 有什么想法吗? 我试图使用raphael.js使中心可点击但不太确定这个尝试。 我正在尝试使用container方法在甜甜圈的中心孔中创建一个圆圈,可以在其上附加一个点击处理程序。 使用Raphael JS的代码信息 Chart.pluginService.register({ beforeDraw: function(chart) { […]

如何从javascript数组本身向图表js添加数据?

我想在数据结构数据中使用图表js ,如果我给出数字为 data : [40,80,5,190,56,55,40]工作正常。 如果我给出一个数组变量或字符串变量,其中包含该数字 var myvalues = my_array.toString(); alert(myvalues); 我得到5,10,14,18变量以及数组。 现在当我使用数组或字符串与图表数据时,如果我尝试如下,我无法获得图表 data : [myvalues] 使用barChartData的完整代码 var barChartData = { labels: [description], datasets: [ { fillColor: “rgba(220,220,220,0.5)”, strokeColor: “rgba(220,220,220,1)”, scaleOverride: true, scaleSteps: 100, stepValue: 1, barShowStroke: false, data: [myvalues] }, { fillColor: “rgba(151,187,205,0.5)”, strokeColor: “rgba(151,187,205,1)”, scaleOverride: true, scaleSteps: 100, barShowStroke: false, stepValue: 1, data: […]

隐藏选项卡内的绘图,宽度= 0,高度= 400的尺寸无效

当我在隐藏标签中插入图表时,如第二,第三等,我有这个错误。这里是错误: Invalid dimensions for plot, width = 0, height = 400 in js/jquery.flot.min.js:6. 我使用了bootstrap 2和jquery: 这是图书馆: 和CSS: #plotarea { max-width: none; height: 400px; } #pie { max-width: none; height: 400px; } #barmonth { max-width: none; height: 400px; } #baryear { max-width: none; height: 400px; } 带有每个图表id的div(总是将id更改为我需要显示的图表,如plotarea,pie,barmonth,baryear等): 我添加这种样式来修复宽度错误.ui-tabs .ui-tabs-hide { left: -10000px; visibility: hidden !important; } […]

导出多个HighCharts以取得优异成绩

我正在使用HighCharts。 现在只需单击导出EXCEL,只有一个图表数据导出到excel。如果我放了一个或多个图表我希望所有这些图表数据在一个EXCEL中,但它只在EXCEL中显示一个图表数据我该怎么做才能得到这个? 任何人都可以请求帮助这里是我的代码:HTML: XLS JavaScript: // Defining the chart $(‘#example-1’).highcharts({ title: { text: ‘Monthly Average Temperature’, x: -20 //center }, subtitle: { text: ‘Source: WorldClimate.com’, x: -20 }, xAxis: { categories: [‘Jan’, ‘Feb’, ‘Mar’, ‘Apr’, ‘May’, ‘Jun’, ‘Jul’, ‘Aug’, ‘Sep’, ‘Oct’, ‘Nov’, ‘Dec’ ] }, yAxis: { title: { text: ‘Temperature (°C)’ }, plotLines: [{ […]