title: Highcharts bubble graph, custom marker
body: <p>I have a bubble series that I want to use one point in one series as a custom marker.  The marker could be a star rendered based on the SVG implementation of HighCharts (5 point-star), or a URL image.</p>
  
  <p><a href="https://assets.mypatentideas.com/images/fiddle/star.png" rel="nofollow noreferrer">https://assets.mypatentideas.com/images/fiddle/star.png</a></p>
  
  <pre><code> series: [{
              //  color: 'red',
  
           data: [                    
                  { x: -0.95, y: 0.54, z: 0.93},
                  { x: -0.15, y: 0.14, z: 1,   marker: {
                  symbol: 'star'
              }}   
  
              ]
          },
          {
              //  color: 'red',
              data: [
                  { x: 0.95, y: -0.54, z: 0.93},
                  { x: 0.15, y: -0.14, z: 1,   marker: {
                  symbol: 'starimage'
              } },
  
  
              ]
          }]
  </code></pre>
  
  <p>The idea is introduced here:</p>
  
  <p><a href="https://jsfiddle.net/mshaffer/kx62dztf/" rel="nofollow noreferrer">https://jsfiddle.net/mshaffer/kx62dztf/</a></p>
  
  <p>For the image, resize so the w and h is equal to the radius if it were a true bubble.  For the SVG star, render so the radius of the star (center to any point) is this same bubble-radius.</p>
  
  <p>Maybe the star needs to be its own series, which is fine.</p>
  
  <p>Few relevant references:
  <a href="https://highcharts.uservoice.com/forums/55896-highcharts-javascript-api/suggestions/3913511-allow-for-custom-symbols-when-using-bubble-chart" rel="nofollow noreferrer">https://highcharts.uservoice.com/forums/55896-highcharts-javascript-api/suggestions/3913511-allow-for-custom-symbols-when-using-bubble-chart</a>
  which points to <a href="http://jsfiddle.net/highcharts/un9faeed/" rel="nofollow noreferrer">http://jsfiddle.net/highcharts/un9faeed/</a> and <a href="http://jsfiddle.net/gh/get/jquery/3.1.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/renderer/" rel="nofollow noreferrer">http://jsfiddle.net/gh/get/jquery/3.1.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/renderer/</a> from <a href="http://www.highcharts.com/demo/renderer" rel="nofollow noreferrer">http://www.highcharts.com/demo/renderer</a></p>