一、 涉及技术
1. React
2. D3
二、 功能需求
1. 用react-stockcharts(github:https://github.com/rrag/react-stockcharts,示例:https://rrag.github.io/react-stockcharts/)在网页上面绘制K线图,要求多幅图实现联动功能,包括鼠标事件的移动、拖动、上滑放大、下滑缩小的K线基本操作。
2. 增加键盘上、下、左、右方向箭头事件,实现移动、放大、缩小的K线基本操作。
3. 其中鼠标移动如http://echarts.baidu.com/echarts2/doc/example/mix8.html#所示,但是还包括鼠标事件的移动、拖动、上滑放大、下滑缩小的K线基本操作,即react-stockcharts本身支持的K线操作鼠标事件。键盘事件类似。
4. 联动,是指一个页面内多幅K线图的联动,多幅K线图在页面内是任意放置的。在一幅图中鼠标位于某一天,则在其余图中,日期也应该相同。在一幅图中拖动、放大、缩小时,其余图的操作行为也是相同的。
三、 非功能需求
1. PC浏览器支持:Chrome、FireFox,不要求支持手机。
2. 对react-stockcharts本身操作性能无卡顿影响。
3. 程序代码上面可参照ECharts的Connect方法,在使用上方便定义,简单便捷。
四、 验收标准
1. 提交代码、代码注释、使用说明、示例。
2. 以页面https://rrag.github.io/react-stockcharts/documentation.html#/moving_average的K线图,在一个页面内包括2~16幅K线图,实现二、三要求的功能。
3. 协助集成和安装。