javascript - How to color point in HighCharts -


hey know if want color specific point, can using fillcolor attribute of current marker.

but when hover point, color return default color of graph,how can prevent such effect?

i want point red in both situation(onhover event , not onhover event),

what attribute per point need change effect happen?

i have added demo below, demo act this: when click canvas of graph,a new graph being generated , first point red when hover , return default color.

$(function () {      $('#container').highcharts({          chart: {              type: 'spline',              margin: [70, 50, 60, 80],              events: {                  click: function (e) {                      // find clicked values , series                      var x = e.xaxis[0].value,                          y = e.yaxis[0].value,                          series = this.series[0];  										var chart = this;                      this.addseries({              							data: [{ x:x, y:y, marker:{radius: 5 , fillcolor: "red" }},{x:(x*2), y:(y*2)}]          							})          	                    }              }          },          title: {              text: 'user supplied data'          },          subtitle: {              text: 'click plot area add point. click point remove it.'          },          xaxis: {              gridlinewidth: 1,              minpadding: 0.2,              maxpadding: 0.2,              maxzoom: 60          },          yaxis: {              title: {                  text: 'value'              },              minpadding: 0.2,              maxpadding: 0.2,              maxzoom: 60,              plotlines: [{                  value: 0,                  width: 1,                  color: '#808080'              }]          },          legend: {              enabled: false          },          exporting: {              enabled: false          },          plotoptions: {              series: {                  linewidth: 1,                  point: {                      events: {                          'click': function () {                              if (this.series.data.length > 1) {                                  this.remove();                              }                          }                      }                  }              }          },          series: [{              data: [[20, 20], [80, 80]]          }]      });  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script src="https://code.highcharts.com/highcharts.js"></script>  <script src="https://code.highcharts.com/modules/exporting.js"></script>    <div id="container" style="min-width: 310px; height: 400px; max-width: 700px; margin: 0 auto"></div>

add in states option setting marker fillcolor:

marker: {     radius: 5,      fillcolor: 'red',      states: {         hover: {             fillcolor: 'red',             }         }      } 

Comments

Popular posts from this blog

sequelize.js - Sequelize group by with association includes id -

android - Robolectric "INTERNET permission is required" -

java - Android raising EPERM (Operation not permitted) when attempting to send UDP packet after network connection -