Question

我是一名合作学生，我正在使用MVC 4中的Highcharts。我的雇主希望能够点击柱形图上的一列，并让用户进入新页面。有没有人对如何做到这一点有任何想法？

我很难在MVC中找到Highcharts的例子，所以如果有人有一些好的资源，请按照我的方式发送。

Answer 1

感谢评论和资源here，我能够解决自己的问题。我的视图将Highcharts对象作为模型，当我的Controller传递它以下的Highcharts对象时：

new Highcharts("chart")
//define the type of chart 
.InitChart(new Chart { DefaultSeriesType = ChartTypes.Column})
//overall Title of the chart 
.SetTitle(new Title { Text = chartTitle })
//small label below the main Title
.SetSubtitle(new Subtitle { Text = subTitle })
//load the X values
.SetXAxis(new XAxis { Categories = xAxisData })
//set the Y title
.SetYAxis(new YAxis { Title = new YAxisTitle { Text = yAxisTitle } })
.SetTooltip(new Tooltip
{
    Enabled = true,
    Formatter = @"function() { return '<b>'+ this.series.name +'</b><br/>'+ this.x +': '+ this.y; }"
})
.SetPlotOptions(new PlotOptions
{
    Line = new PlotOptionsLine
    {
        DataLabels = new PlotOptionsLineDataLabels
        {
            // this makes the value of the dot appear above it if it is set to true (for Line charts)
            Enabled = true
        },
        // set to true so that when the user hovers their mouse over a column/dot it's value and name will appear
        EnableMouseTracking = true
    },
    /***********
     * IMPORTANT PART
     ************/
    Series = new PlotOptionsSeries
    {
        Point = new PlotOptionsSeriesPoint
        {
            Events = new PlotOptionsSeriesPointEvents
            {
                // Here you can put code for different event handlers (like Click and MouseOver) in javaScript.
                // The one below makes an alert box pop up with the name of the column and its value when a 
                // column is clicked
                Click = "function () {alert('Category: ' + this.category + ', value: ' + this.y);}"                   
            }
        }
    }
})
//load the Y values 
.SetSeries(yAxisData.ToArray());

Answer 2

在高级图表中，您应该在系列点上抓住click event。

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends Activity {
public int x = Integer.parseInt("");
public int y = Integer.parseInt("");
public int z = (y/x);
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    //Button
    Button btn = (Button) findViewById(R.id.button);


    //EditText
    EditText nop = (EditText) findViewById(R.id.editText);
    EditText cob = (EditText) findViewById(R.id.editText2);

    x = Integer.parseInt(nop);
    y = Integer.parseInt(cob);


    final TextView tv = (TextView) findViewById(R.id.textView);

    btn.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            tv.setText(z);
        }
    });

}
}

检查asp.net的wrappers是否支持该选项。

在MVC 4中使用Highcharts的OnClick（）

2 个答案: