井井客

搜索

修改highstock默认颜色生成红绿K线图

最新改的一个由highstock生成的行情图,需求是将默认的蓝色和白色改成红色和蓝色以符合正常K线图的样子,下面看看我是怎么做的。

修改highstock默认颜色生成红绿K线图

先看了API文档学习了一下,不过可能因为看的是中文API(英文不太好),里面找了下实在没看到,所以直接就去原码里面找了,我觉得这种方法还满方便和适用的。

第一步,可以在API文档中找到colors这个接口,有个默认值,先把这个改成绿色吧

colors:['green']

第二步,将highstock.js源码在http://tool.lu/js/在线美化一下,因为原来是压缩过的,美化后就比较方便找到了。

因为用的是candlestick,所以搜索这个词再看一下位置,找到了一个比较像的值

	V.candlestick = y(V.column, {
		lineColor: "black",
		lineWidth: 1,
		states: {
			hover: {
				lineWidth: 2
			}
		},
		tooltip: V.ohlc.tooltip,
		threshold: null,
		upColor: "white"
	});

英文不好,Js也不好,估计就当它是默认值吧,其中这个upColor和lineColor很像呢

第三步,尝试改一下upColor和lineColor值,发现upColor值就是我们所需要改的东西那就改成红色吧

upColor: "white"

刚才说的有些零乱,加上我不太会说,所以还是直接看一下效果图,这个比较直观。

具体实现代码可点击这里

文章TAG:JS

作者:井井客原创来源:原创
本文标题:修改highstock默认颜色生成红绿K线图
本文链接:/c/22131.html

上一篇:jQuery全屏滚动插件fullPage.js
下一篇:预设css3动画库推荐Animate.css

文章分类

相关阅读

随便看看