Tag: highcharts

带有json数据的动态高图: 我试图弄清楚是否可以在php和mysql的帮助下从数据库中动态获取json数据，并且可以使用过于动态自动更新的highcharts进行绘制？任何帮助，将不胜感激。遵循我已经尝试过的代码并且工作不正常并希望在网站上实现10行。 highchart example var chart; function requestData() { $.ajax({ url: ‘live-server-data.php’, success: function(point) { var series = chart.series[0], shift = series.data.length > 20; // shift if the series is // longer than 2 // add the point chart.series[0].addPoint(point, true, shift); // call it again after one second setTimeout(requestData1, 1000); }, cache: false, }); […]

Highcharts – 在对数Y轴的折线图系列中处理和显示零（或负）值的最佳方法: 在我的HighChart折线图中，系列数据是从我的Ruby on Rails应用程序动态提供的。有时系列值为零或更小，这是HighCharts的一个问题，它会抛出以下exception： Highcharts Error #10 Can’t plot zero or subzero values on a logarithmic axis 因此，作为解决方法，我处理我的ruby数组以有条件地将一个较小值的零替换为无效的正数，.eg 0.00001，如下所示： oil_vol_array = d_array[1].map { |e| (e < 0.0001) ? 0.0001 : e.round(3) } 这可以防止抛出exception，但是如果起始值为零，显示屏将显示从0.0001开始的图形（可以理解的是，因为我要求它）。更理想的显示是将图形设置为零，但HighChart不喜欢它:( 有没有办法实现这一目标？

HighCharts饼图 – 在每个切片内添加文本: 我正在使用代表资产分配的HighCharts创建一个金融饼图。我的目标是创建一个表示每个切片中实际分配值的图表，但每张幻灯片内部将显示第二个数据标签，该标签显示各种投资工具的目标百分比。值得注意的是，当前的资产配置可能并不总是与目标分配值相匹配。除了每张幻灯片中的Target标签外，我已经完成了所有工作。请参阅下图，了解我想要完成的任务：这是我到目前为止： var asset_allocation_pie_chart = new Highcharts.Chart({ chart: { renderTo: ‘asset_allocation_bottom_left_div’ }, title: { text: ‘Current Asset Allocation’, style: { fontSize: ’17px’, color: entity_color, fontWeight: ‘bold’, fontFamily: ‘Verdana’} }, subtitle: { text: ‘(As of ‘ + effective_date_formatted + ‘)’, style: { fontSize: ’15px’, color: entity_color, fontFamily: ‘Verdana’, marginBottom: ’10px’ }, y: […]

如何将json数据传递给highcharts系列？: 我有跟随在运行时生成的json数组。因此，名称/数据对的数量变化。 `var sales = { “SalesData” : [ { “name” : “AllProducts|Canada”, “data” :[44936.0,50752.0] }, { “name” : “AllProducts|Mexico”, “data” : [200679.0,226838.0] }, { “name” : “AllProducts|USA”, “data” : [288993.0,289126.0] } ]} ` 我想将这些数据传递给highcharts中的系列。这就是我目前的做法。 series: [ {name:sales.SalesData[0].name,data:sales.SalesData[0].data}, {name:sales.SalesData[1].name,data:sales.SalesData[1].data}, {name:sales.SalesData[2].name,data:sales.SalesData[2].data} ] 但是如果数组中的元素数量发生了变化，那么这将不起作用。我该如何解决这个问题？演示代码将帮助我。我已经审问了以下问题，但我无法解决问题。动态添加到Highcharts Highcharts系列数据arrays

Highcharts / jQuery – 使用原始选项销毁和重建图表: 基于此线程中的信息：实现自己的状态 – INACTIVE_STATE？我已经建立了一个符合我需求的图表 – jsfiddle 我添加了一些自定义控件，允许用户显示/隐藏所有系列并检查/取消选中所有系列。这一切都很好。我想做的最后一部分是允许用户使用原始选项重置图表。这部分我也开始工作，但是有一个问题：一旦图表重建，允许用户显示/隐藏/检查/取消选中的function不再起作用，因为我已经销毁并重新指定了它们运行的变量的。所以我的问题 – 这是破坏和重建图表的正确方法，还是有更好的方法？如果这是这样做的话，那么如何让我的show / hide / check / uncheck函数继续工作呢？重置图表的代码如下： //reset the chart to original specs $(‘#resetChart’).click(function(){ chart1.destroy(); chart1 = new Highcharts.Chart(optionsChart1,highlightSer); }); highlightSer是一个回调function，以突出某些系列。以后不再起作用的代码示例： var chart = chart1; $(‘#showAll’).click(function(){ for(i=0; i < chart.series.length; i++) { chart.series[i].show(); } }); 谢谢！

如何启用Highcharts滚动条？: 我试过了 scrollbar: { enabled: true } 但它没有用。我尝试使用highstocks附带的highcharts.js ..也没用。难道我做错了什么？

使用require.js加载Highcharts: 我已经尝试了一段时间，但没有成功将加载高图作为require模块。我想知道是否有人设法让这个工作，或者他们是否有任何指示让我走上正确的轨道？谢谢

将系列总数添加到Highcharts中的图例: 使用Highcharts.js – 我想将系列总数添加到图例中（当前它表示’12345’）。我知道我需要写一个labelFormatter函数，但我不知道足够的JavaScript来弄清楚如何总结每个系列的总和。代码如下（此处也有实时版本： http ： //jsbin.com/ukabob/8 ）。 $(function () { var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: ‘container’, type: ‘line’, backgroundColor: ‘#E9E7DC’, borderRadius:0, margin: [0, 150, 30, 0] }, colors: [‘#A74B59’, ‘#46C4B7’, ‘#EDBA70’], credits: { enabled: false }, title: { text: null }, xAxis: { categories: [‘2013’, ‘2014’, ‘2015’, […]

在setdata之后加载动画的Highcharts: 我正在使用Highcharts图，我使用.setData来更新图中的数据。这一切都运行正常，但我想使用加载动画（线图从左到右绘制自己）每次重置数据时都会触发。有没有办法调用这个动画？

Highcharts：使图例符号为正方形或矩形: 我正在尝试将图例符号设置为线图的正方形或矩形。例这条线很好。我不想改变线宽。 HTML：使用Javascript： $(function () { var chart = new Highcharts.Chart({ chart: { renderTo: ‘container’, type: ‘line’, }, xAxis: { categories: [‘Jan’, ‘Feb’, ‘Mar’, ‘Apr’, ‘May’, ‘Jun’, ‘Jul’, ‘Aug’, ‘Sep’, ‘Oct’, ‘Nov’, ‘Dec’] }, plotOptions: { series: { marker: { enabled: false } } }, legend: { layout: ‘vertical’, align: ‘right’, verticalAlign: […]