0
好的，这里一直在我的头上撞墙，所以想想现在是时候寻求帮助了！当CSS主题发生变化时切换Highcharts主题
我一直在考虑放入一些Highcharts图表（http://www.highcharts.com/demo/column-basic/gray）。非常酷的图表，但我想看看我是否可以解决一个特定的问题。
我正在运行一个ASP.Net webforms网站，在这个网站上我有一个CSS切换器，它允许最终用户点击一个链接来改变他们在页面上的CSS主题，基本上是明亮或黑暗。
这是通过菜单中的HTML完成：
<ul id="nav">
<%--parameter" doesn't do anything but it forces an update of the CSS each time it's called--%>
<li><a href="#" rel="/Styles/lightside.css?parameter=1">Lightside</a></li>
<li><a href="#" rel="/Styles/Darkside.css?parameter=1">Darkside</a></li>
</ul>
和文档准备JavaScript函数：
// CSS Switcher
// Stores CSS Selection in a Cookie object using JQuery cookie plugin
// http://plugins.jquery.com/cookie/
$("#nav li a").click(function() {
$(".switch[rel='stylesheet']").attr('href', $(this).attr('rel'));
$.cookie("css", $(this).attr('rel'), { expires: 365, path: '/' });
return false;
});
此开关lightside.css和darkside.css之间的css文件。这工作正常，并立即应用。我想知道是否可以在CSS主题切换时在Highcharts上应用主题更改。
我读了一遍，发现这个网页：http://www.highslide.com/forum/viewtopic.php?f=9&t=5586 - 它让我更好地了解如何改变主题。
最终，我遇到的问题是每次切换CSS样式表时都找不到重绘图表的方法，因为绘制图表的代码是Document Ready函数本身的一部分，而且我无法看到重新应用我的风格的方式。
绘制图表的代码是这样的，例如：
var table = $('table#MainContent_GridViewUserNumbersDaily');
var skipheader = true;
// Retrieve Values into an object called ChartTable
var ChartTable = $('tbody tr', table).map(function() {
var $row = $(this);
return {
'Date': $row.find(':nth-child(1)').text(),
'User2007': $row.find(':nth-child(2)').text(),
'User2007Diff': $row.find(':nth-child(3)').text(),
'User2010': $row.find(':nth-child(4)').text(),
'User2010Diff': $row.find(':nth-child(5)').text(),
'User2013': $row.find(':nth-child(6)').text(),
'User2013Diff': $row.find(':nth-child(7)').text(),
'UserTotal': $row.find(':nth-child(10)').text(),
'UserTotalDiff': $row.find(':nth-child(11)').text(),
};
}).get();
//// All User Numbers Chart ////
var newArray = [];
// Loop through all the rows in ChartTable
for (var i = 0; i < ChartTable.length; i++) {
// Vars
var xData, yData, object;
object = ChartTable[i];
// Parse Data
xData = parseDateTime(object["Date"]);
yData = parseFloat(object["UserTotal"]);
// Append to Array
if (skipheader = true) {
if (i != 0) {
newArray.push([xData, yData]);
}
}
else {
newArray.push([xData, yData]);
}
};
$('#chartUserNumbersTotal_div').highcharts({
chart: {
defaultSeriesType: 'line'
},
xAxis: {
type: 'datetime',
minorTickInterval: (24 * 3600 * 1000) * 7, // 1 Week
},
series: [{
name: 'All Useres',
data: newArray,
marker: {
enabled: false
}
}],
yAxis: {
title: {
text: 'Useres'
}
},
title: {
text: 'All Useres'
},
legend: {
enabled: false
}
});
我也许能敲这一切的了的jsfiddle如果有帮助，但会看看是否有人能明白我想先！
感谢您的阅读。
使用'redraw'函数来重绘时，你想要的。 –
我确实看过重绘，但看不到任何添加该函数的方式来全局重绘图表，或指定要重绘的图表，所以没有太多的帮助。 – HungryHippos