2012-10-03 16 views
5

Usando Highcharts, ¿cómo puedo seleccionar un punto usando su identificación? Por ejemplo, si se crea un gráfico utilizando el siguiente código:Seleccionar un punto por ID usando Highcharts

chart1 = new Highcharts.Chart({ 
     chart: { 
      renderTo: 'container', 
      type: 'scatter' 
     }, 
     title: { 
      text: 'Fruit Consumption' 
     }, 
     xAxis: { 
      categories: ['Apples', 'Bananas', 'Oranges'] 
     }, 
     yAxis: { 
      title: { 
       text: 'Fruit eaten' 
      } 
     }, 
     series: [{ 
      name: 'Jane', 
      data: [{ 
       name: 'Point1', 
       x: 1, 
       y: 2 
      }, { 
       name: 'Point2', 
       x: 2, 
       y: 5 
      }] 
     }, { 
      name: 'John', 
      data: [5, 7, 3] 
     }] 
     }); 
    }); 

La descripción me dice que cuando se ciernen sobre un punto, lo que el id es. Sin embargo, no puedo entender la sintaxis para identificar ese punto. Sé que chart1.series[0].name devuelve Jane. Also, chart1.series [0] .data [0] .name returns point1` ¿Hay alguna manera fácil de seleccionar el punto y cambiar el color sabiendo solo 'point1'?

Me pregunto si hay una manera más eficiente que no sea recorrer todos los puntos cada vez.

+0

La lectura de la documentación de la API es siempre la mejor manera de aprender cómo llevar a cabo tareas .. y es una fuente alternativa y eficiente de aprendizaje/formación. :) http://api.highcharts.com/highcharts –

+2

Hice esta pregunta hace casi dos años. En ese momento, no se discutió en la documentación. – djq

Respuesta

9

Puede establecer un id por cada punto que desee obtener.

series: [{ 
    name: 'Jane', 
    data: [{ 
     'name': 'Point1', 
     'id': 'point1', 
     'x': 1, 
     'y': 2 
    }, { 
     'name': 'Point2', 
     'id': 'point2', 
     'x': 2, 
     'y': 5 
    }] 
}, { 
    name: 'John', 
    data: [5, 7, 3] 
}] 

A continuación, puede obtener el punto por el siguiente código.

// assuming that chart is your chart var 
chart.get('point1'); 

demo

O si no desea establecer una id puede recorrer sencilla thrue points comparar la name usted quiere encontrar la point name.

Referencia:

+0

limpio, simple y eficiente. –

+0

Excepto que no es eficiente. Limpio y simple sigue siendo cierto, pero detrás de escena El método "chart.get()" de HighChart está iterando a través de cada serie y cada punto de esa serie para encontrar una coincidencia. Es O (n) en conjuntos de datos que ya están ordenados por valor x de todos modos. Por lo tanto, una búsqueda binaria implementada por el desarrollador de la aplicación que utiliza Highcharts ofrecería una mejor eficiencia, ya que al menos puede obtener O (log N) buscándolo usted mismo. – Sensei

Cuestiones relacionadas