- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我的 MVC 网络应用程序中有一个简单的图表。现在我有一些过滤器可以根据它们的 click
事件更新图表。实际上,点击事件将使用 ajax 调用来更新图表。
这是我的图表:
$('#performance-cart').highcharts({
chart: {
type: 'area', backgroundColor: '#f5f7f7', style: { fontFamily: 'Roboto, Sans-serif', color: '#aeafb1' },
animation: {
duration: 1500,
easing: 'easeOutBounce'
}
},
xAxis: {
type: 'datetime',
labels: { style: { color: '#aeafb1' } }
},
yAxis: {
min: 0, max: 50, tickInterval: 10, gridLineColor: '#ebeded', gridLineWidth: 1,
title: { text: '' }, lineWidth: 0, labels: { align: 'right', style: { color: '#aeafb1' } }
},
title: { text: '' },
tooltip: {
useHTML: true, headerFormat: '<h3 style="color:#ffffff;font-weight:300;padding: 3px 12px;">{point.y:,.1f}</br>',
backgroundColor: '#515757', pointFormat: '{series.name}'
},
legend: {
itemStyle: { color: '#838589' }, symbolWidth: 12, symbolHeight: 5, itemWidth: 80, symbolRadius: 0,
itemMarginBottom: 10, backgroundColor: '#f5f7f7', verticalAlign: 'top', borderWidth: 0, x: -498, y: 10
},
plotOptions: {
area: {
fillOpacity: 0.2, cursor: 'pointer', marker: {
symbol: 'circle', fillColor: '#FFFFFF', lineWidth: 2, lineColor: null,
allowPointSelect: true
}
},
line: {
fillOpacity: 0.2, cursor: 'pointer', marker: {
symbol: 'circle', fillColor: '#FFFFFF', lineWidth: 2, lineColor: null,
allowPointSelect: true
}
},
column: {
fillOpacity: 0.2, cursor: 'pointer', marker: {
symbol: 'circle', fillColor: '#FFFFFF', lineWidth: 2, lineColor: null,
allowPointSelect: true
}
},
series: {
pointStart: myIssueResolvedStartDate,
pointInterval: 24 * 3600 * 1000 // one day
}
},
series: [{
name: 'Issues', color: '#ff3806',
data: myIssueData,
marker: { states: { hover: { fillColor: '#ff3806', lineColor: '#ffffff', lineWidth: 2 } } }
}, {
name: 'Resolved', color: '#1da9dd',
data: myResolvedData,
marker: { states: { hover: { fillColor: '#1da9dd', lineColor: '#ffffff', lineWidth: 2 } } }
}]
});
现在在我的 ajax 调用中,我做了类似这样的事情来更新图表:
var chart = $('#performance-cart').highcharts();
chart.options.plotOptions.series.pointStart = newDate; \\newDate = 1404086400000
chart.series[0].setData(issue, true);
chart.series[1].setData(resolve, true);
问题是,chart.options.plotOptions.series.pointStart = newDate;
不更新 pointStart。我检查了 newDate
变量中的值,它以 UTC 格式显示了完美的日期。系列数据正在完美更新中。
我相信我写错了语法或 pointStart 的东西。如果有人能指出问题,我将不胜感激。
最佳答案
您不能实时更新 plotOptions
(也许有一些 hack,但我们不提供官方 API 方法)。但是,您可以像这样更新每个系列:
var chart = $('#performance-cart').highcharts();
chart.series[0].update({
data: issue,
pointStart: newDate
}, true);
chart.series[1].update({
data: resolve,
pointStart: newDate
}, true);
关于javascript - Highcharts : How to update Plotoptions pointStart on Ajax call?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24506334/
我正在使用 highcharts 来显示每日统计数据,我希望用户能够选择一个日期范围。 function requestData(chart, from, to, group) { $.aja
我有一个非常简单的 highcharts js 图表,它在 x 轴上有日期,在 y 轴上有值。它适用于这段代码: chart = new Highcharts.Chart({ chart: {
我想做的是将一个变量传递给 Highcharts 的 pointStart 选项。 这是javascript的一部分 var dtTemp = '1303401600000'; //
我的 MVC 网络应用程序中有一个简单的图表。现在我有一些过滤器可以根据它们的 click 事件更新图表。实际上,点击事件将使用 ajax 调用来更新图表。 这是我的图表: $('#performa
我使用此图表来显示我通过 RestService 获取的数据,格式如下: "jsonData": [ { "Resource": "ABC", "Tim
我是一名优秀的程序员,十分优秀!