title: How to keep all activeDots always "active" rather than hovering over data points (recharts)
body: <p>I have the package "recharts" (latest version 1.5.0) from npm installed and properly loaded with data on my react project.</p>
  
  <p>Data lines and chart are always active. I need all the "activeDots" to always be active rather than active only when hovering over data points.</p>
  
  <pre><code>   &lt;LineChart
          width={240}
          height={180}
          data={data}
          margin={{top: 15, right: 10, left: 10}}
        &gt;
           &lt;CartesianGrid horizontal={false} /&gt;
           &lt;XAxis
            dataKey="x"
            stroke="rgba(0,0,0,0.4)"
            strokeWidth=".4"
            scale="time"
            type="number"
            domain={['auto', 'auto']}
            tick={{fontSize: 12}}
            tickFormatter = {(unixTime) =&gt; moment(unixTime).format('MMM D')}
           /&gt;
           &lt;YAxis hide={true} /&gt;
           &lt;Tooltip content={&lt;CustomTooltip/&gt;}/&gt;
           &lt;Line
            connectNulls={false}
            type="linear"
            dataKey="pv"
            stroke="#3F99F7"
            strokeWidth="3"
            activeDot={{ fill: '#3F99F7', stroke:'#fff', strokeWidth: 3, r: 11, className: "boxShadow" }}
            dot={{ fill: '#3F99F7', stroke:'#fff', strokeWidth: 2, r: 7, className: "boxShadow" }}
           /&gt;
        &lt;/LineChart&gt;
  </code></pre>
  
  <p>not hovering over data points:
  <a href="https://i.stack.imgur.com/oJElB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/oJElB.png" alt="not hovering"></a></p>
  
  <p>hovering over data point: 
  <a href="https://i.stack.imgur.com/NWqMw.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NWqMw.png" alt="hovering"></a></p>