我有一个包含两个区域的图表。当我在滚动条上缩放或滑动一个图表区域时，其他图表区域也会缩放和滑动。我一直在尝试将平移添加到我的项目中。在搜索时，我发现了MSChart Extension，并且喜欢它（https://www.codeproject.com/Articles/357817/MSChart-Extension-Zoom-and-Pan-Control）。
我想使用MSChart Extension，但就像我说的那样，我需要同步两个图表区域。当我缩放一个图表区域时，必须缩放另一个图表区域，或者当我平移一个区域时必须自动平移另一个图表区域。
或者我只需要添加平移功能而不是没有MSChart Extension的滚动条。
你能帮我吗？
我在不带mschart扩展名的标准图表代码上执行了以下代码，它与鼠标滚轮缩放和在滚动条上滑动一起使用，但是当我使用MSChart Extension控制图表（缩放和平移）时，它不会同步两个图表区域。
private void chart1_AxisViewChanged(object sender, ViewEventArgs e)
{
if (e.Axis == chart1.ChartAreas["ChartArea1"].AxisX)
{
chart1.ChartAreas["ChartArea2"].AxisX.ScaleView.Size = chart1.ChartAreas["ChartArea1"].AxisX.ScaleView.Size;
chart1.ChartAreas["ChartArea2"].AxisX.ScaleView.Position = chart1.ChartAreas["ChartArea1"].AxisX.ScaleView.Position;
}
if (e.Axis == chart1.ChartAreas["ChartArea2"].AxisX)
{
chart1.ChartAreas["ChartArea1"].AxisX.ScaleView.Size = chart1.ChartAreas["ChartArea2"].AxisX.ScaleView.Size;
chart1.ChartAreas["ChartArea1"].AxisX.ScaleView.Position = chart1.ChartAreas["ChartArea2"].AxisX.ScaleView.Position;
}
}
最好的问候，
答案 0 :(得分：0)
如果您有两个图表区域，则可以使用//in render()
<Modal
animationType="slide"
onRequestClose={this.onCloseModal}
transparent={false}
visible={this.props.uploadModalVisible}
>
[....]
const mapStateToProps = (state) => {
return {
user: state.auth.user,
loading: state.diary.loading,
uploadModalVisible: state.diary.uploadModalVisible,
monthModalVisible: state.diary.monthModalVisible,
editModalVisible: state.diary.editModalVisible,
entryUploading: state.diary.entryUploading,
deleteEntryDisabled: state.diary.deleteEntryDisabled,
entries: state.diary.entries
};
};
和import React from 'react';
export default class TQValueCalculator extends React.Component {
constructor(props) {
super(props);
this.state = ({result:0});
this.input = React.createRef();
this.handleChange = this.handleChange.bind(this);
}
calculateTQValue(letter) {
switch(letter) {
case 'a':
return 1;
case 'b':
return 2;
case 'c':
return 3;
default:
return null;
}
}
handleChange(event) {
this.setState({result: 0})
console.log("Initial Result " + this.state.result);
for (var i = 0; i < this.input.current.value.length; i++) {
this.setState({result: this.state.result +
this.calculateTQValue(this.input.current.value.charAt(i))})
}
console.log("Final Result " + this.state.result);
}
render(){
return(
<div>
<input
type="text"
name="word"
placeholder='Write here...'
defaultValue = ''
ref={this.input}
onInput={this.handleChange}
>
</input>
<p>
Result: {this.state.result}
</p>
</div>
)
}
}
方法将它们与AxisView等特殊属性对齐。
例如：
AlignWithChartArea