标签: highstock
如何使用范围和导航器功能在Highcharts中创建列范围图表？
我有一个要求,绘制运行历史一个的任务在Highcharts.它需要将任务的运行历史显示为水平条.我在下面的更新中添加了其他要求.最近我发现StockChartinverted不支持该选项,并且StockChart中只有navigator和rangeSelector可用.因此我正在使用这些功能.
因此,为了达到要求,我创建了类似于这个jsfiddle示例的东西(在浏览时发现某处不记得来源),并在我之前的问题的帮助下结束了这个plunker链接,感谢Pawel Fus
更新问题以避免混淆
其他要求:
显示只有那些任务,其运行在一个特定的日期和时间范围.如果运行次数太多,例如运行次数超过10次,则需要有一种方法,只能使用可滚动显示其他任务的y轴显示10个任务. plunker链接到问题
上述拔毛器的问题解释.
如果你从上面的plunker检查下面的截图,时间范围是从12/12/2014 09:32:26,12/12/2014 10:32:26并且只有2个任务已经运行m_ARRAYV_SALES_ZIG1_CALL2_VOD__C_OB&m_ZIG2_HCP_MERGE_IB_CN.但是我可以看到之间的另一个任务,LILLY_C甚至没有在这个日期时间范围内运行.(在实际数据中,有超过10个任务使这个图表混乱,甚至不属于这个日期时间范围)
此外,如果你注意到最右边的角落时间从转移09:38到19:20.19:20是m_ZIG2_HCP_MERGE_IB_CN任务的结束时间.
以下是我的图表选项
var chart_options = {
chart: {
renderTo: 'container',
height: 600
},
title: {
},
credits: {
enabled: false
},
xAxis: {
type: 'datetime', …推荐指数
解决办法
查看次数
如何更改highcharts饼图的颜色？
我正在使用highcharts制作饼图,但我在为图表加载自定义颜色集时遇到问题.
这是我的代码:
<script type="text/javascript">
$(function () {
Highcharts.setOptions({
colors: ['#50B432', '#ED561B', '#DDDF00', '#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4']
});
return new Highcharts.Chart({
chart: {
renderTo: 'trailpiechart',
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false,
backgroundColor: "#f8f8f8",
margin: [20, 20, 20, 20]
},
credits: {
enabled: false
},
title: {
text: caption
},
tooltip: {
formatter: function () {
return this.y + ' links';
}
},
plotOptions: {
pie: {
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: false
},
showInLegend: true
}
},
legend: …推荐指数
解决办法
查看次数
Highstock highcharts不规则数据错误x-scale
我有不规则的数据.使用highcharts时,图表绘制得很好:
$(function() {
var chart = new Highcharts.Chart({
chart: {
renderTo: 'chart'
},
xAxis: {
type: 'datetime'
},
series: [{
name: 'Volume',
data: chart_arr,
}]
});
});
但我有很多数据,所以我需要放大日期并选择highstock.然后发生一件奇怪的事情:x轴变成非线性的.
$(function() {
var chart2 = new Highcharts.StockChart({
chart: {
renderTo: 'chart2'
},
rangeSelector: {
selected: 0
},
xAxis: {
type: 'datetime'
},
series: [{
name: 'val',
data: chart_arr,
type : 'area',
}]
});
});
请注意,1月6日20:00-20:30半小时范围内的数据比1月11日至13日的2天分配的空间更多.(当然数据是一样的.)
如何强制高轴的x轴变为线性？或者如何为highcharts启用底部缩放工具？谢谢.
推荐指数
解决办法
查看次数
在单个网页中管理多个高清图表
我在一个网页中有多种不同类型的高图表(Bar,Pie,Scatter类型).目前我正在为每个图创建配置对象,比如
{
chart : {},
blah blah,
}
并将它们提供给一个可以调用的自定义功能HighCharts.chart().但这会导致代码重复.我想集中管理所有这些图表渲染逻辑.
关于如何做到这一点的任何想法？
推荐指数
解决办法
查看次数
Highstocks - 如何更改默认缩放
这个问题源于谷歌搜索高档,缩放,极端,范围和其他所有可能的单词变化的小时数,所有这些都导致高图表答案的自定义函数的一些变化.
有没有办法简单地在HighStocks(而不是HighCharts)中将默认缩放更改为1个月而不是3个月,而无需编写函数来计算它恰好是什么？
推荐指数
解决办法
查看次数
删除图表上的网格线
我有lib HighCharts 的图表,我想在我写的图表上删除yAxis的网格线,gridLineWidth: 0
但网格线没有删除所有代码:
<script type="text/javascript">
(function($){ // encapsulate jQuery
$(function() {
Highcharts.setOptions({
lang: {
rangeSelectorZoom: '??c????',
rangeSelectorFrom: '??',
rangeSelectorTo: '??',
thousandsSep: ' '
},
global: {
useUTC: false
}
});
$.getJSON('http://www.highcharts.com/samples/data/jsonp.php?filename=aapl-c.json&callback=?', function(data) {
// Create the chart
window.chart = new Highcharts.StockChart({
chart : {
borderColor: 'white',
renderTo : <?php echo "cont".$i; ?>,
backgroundColor: '#f9f9f9' // ??????? ?????? ????? ???
},
rangeSelector: {
buttons: [
{
type: 'week',
count: 1,
text: '??????',
},
{
type: 'month', …推荐指数
解决办法
查看次数
替换/删除公制符号,如千位"k"缩写
我的areapline图表的Y轴值最大约为6000.Highcharts会自动更改Y轴上的"000"部分为"k".
因为我是法国人并且该网站意味着使用相同的语言,所以这个"k"缩写在我的情况下是没有意义的,我想要一个随意的"000"显示而不是它.
这可能吗？怎么样？
推荐指数
解决办法
查看次数
为什么.html()不能与使用jquery的SVG选择器一起使用？
问题可以有人告诉我如何将我的SVG元素转换为字符串？
我正在使用canvg将我的SVG转换为图像.
它必须首先在画布中渲染,该canvg()方法期待aSVG STRING
代码:
function updateChartImage(){
canvg(document.getElementById('canvas'),expecting ` svg string`);
var canvas = document.getElementById("canvas") ;
var img = canvas.toDataURL("image/png");
img = img.replace('data:image/png;base64,', '');
$("#hfChartImg").val(img) ;
$('#img').attr({ src: img });
}
我试过了
$('#container svg').html() ; // it gives me an error
//Uncaught TypeError: Cannot call method 'replace' of undefined
注意到
$('#container svg')
$('#container').html() // both works fine and
更新
我正在使用highcharts有一个getSVG()函数,我可以传递给canvg(),但问题是它没有得到最新的更新,所以我必须这样做,当运行getSVG()函数我得到了以下:
推荐指数
解决办法
查看次数
在同一页面上使用highchart和highstock
我有这个页面:
<script type="text/javascript" src="jQuery/Highcharts/highstock1.1.6.js"></script>
<script type="text/javascript" src="jQuery/Highcharts/highcharts2.1.4.js"></script>
并在我使用的页面中
$.getJSON(
"server/indice.server.php?row=" + row +"&item="+ item,
null,
function(data)
{
chartindice = new Highcharts.Chart(
{
chart:
{
renderTo: 'graph',
defaultSeriesType: 'line',
zoomType: 'x'
},
/////moore setting..
series:
[{
type: 'area',
name: titleindice,
data: indice,
showInLegend : false //disable the the show/hide icon
}]
});
});
和高库存图
window.chart = new Highcharts.StockChart({
chart: {
renderTo: 'chartHistory'
},
rangeSelector: {
selected: 2
},
series: [{
data: history,
type: 'spline',
tooltip: {
valueDecimals: 2
}
}]
}); …推荐指数
解决办法
查看次数
Highcharts不显示包含大量数据点的系列
我有一个图表,我想根据用户的日期范围显示.此特定图表每15分钟有一个数据点.因此,如果用户选择较大的日期范围,每个系列可能会有很多数据点.以下是几个例子:
在第一个示例中,图表会显示.在第二个示例中,不显示图表.有一个Highstock演示(52,000点数据分组),可以处理大量数据点.我试图将上面的图表更改为高价图表并仍然具有相同的结果.
我该怎么做才能解决这个问题？
推荐指数
解决办法
查看次数