2013-03-08 5 views
0

Je travaillais avec Highcharts en utilisant PlotLines. Je voudrais ajouter un lien pour faire quelque chose (supprimer ou mettre à jour par exemple) à l'intérieur de l'étiquette de la PlotLine.Highcharts Comment ajouter un lien dans PlotLines?

$(function() { 
     $(document).ready(function() { 

      var chart = new Highcharts.Chart({ 
       chart: { 
        renderTo: 'container', 
        type: 'column' 
       }, 
       title: { 
        text: 'Add Link in PlotLines' 
       }, 
       xAxis: { 
        categories: ['Africa', 'America', 'Asia'], 
       }, 
       yAxis: { 
        plotLines:[{ 
         value:450, 
         color: '#ff0000', 
         width:2, 
         zIndex:4, 
         id:'PlotLine1', 
         label:{text:'PlotLine 1 ' + '<a href="#" onClick="delete(PlotLine1);">Delete</a>'}    
        }, 
        { 
         value:200, 
         color: '#000055', 
         width:2, 
         id:'PlotLine2', 
         zIndex:4, 
         label:{text:'PlotLine 2 ' + '<a href="#" onClick="delete(PlotLine2);">Delete</a>'}     
        }]     
       }, 
       series: [{ 
        name: 'Year 1800', 
        data: [107, 31, 50] 
       }, 
         { 
        name: 'Goal', 
          type: 'scatter', 
          marker: { 
         enabled: false 
        }, 
        data: [450] 
       }] 
      }); 
     }); 


}); 

Si vous voyez le code source généré des plotlines vous pouvez voir quelque chose comme ceci:

<tspan onclick="location.href="#"" style="cursor: pointer;" dx="3"> 
     Delete 
</tspan> 

Je ne sais pas s'il y a un moyen d'ajouter un lien ou un bouton dans la étiquette. La source est http://jsfiddle.net/nDjdc/21/

Merci à l'avance,

Répondre

3

Highcharts ne semble pas porter l'attribut onClick quand il rend, mais elle ne porte le href vous pouvez donc le faire:

<a href="javascript: deleteMe('PlotLine1');">Delete</a> 

J'ai créé un violon de travail sur le vôtre. S'il vous plaît consulter: http://jsfiddle.net/amyamy86/V82pQ/

mise en garde seulement est qu'il a seulement accès à des objets globaux, donc j'espère que vous espace de nom de votre application appropriée :)

Fyi delete est pas un bon nom pour la variable car il est un mot réservé . Voir https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Reserved_Words

Questions connexes