CS Sharing 07 | samples | Documentation

HTMLcopy

 
<button onclick="share('facebook')"><img src="https://static.anychart.com/images/fbicon.png"></button>
<button onclick="share('twitter')"><img src="https://static.anychart.com/images/twicon.png"></button>
<button onclick="share('linkedin')"><img src="https://static.anychart.com/images/linkicon.png"></button>
<button onclick="share('pinterest')"><img src="https://static.anychart.com/images/pinicon.png"></button>
<div id="container"></div>

CSScopy

 
html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}
img {
  width: 25px;
  height: 25px;
}
button {
  border: none;
  background: none;
  padding: 0;
}
#container {
  position: absolute;
  width: 100%;
  top: 35px;
  bottom: 0;
}

JavaScriptAutocompletecopy

​x
 
anychart.onDocumentReady(function () {  
    // create pie chart with passed data
    chart = anychart.pie([
['Department Stores', 6371664],
['Discount Stores', 7216301],
['Men\'s/Women\'s Stores', 1486621],
['Juvenile Specialty Stores', 786622],
['All other outlets', 900000]
    ]);
​
    // set container id for the chart
    chart.container('container');
​
    // set chart title text settings
    chart.title('ACME Corp. apparel sales through different retail channels');
  
    //set chart radius
    chart.radius('43%');
​
    // create empty area in pie chart
    chart.innerRadius('30%');
​
    // initiate chart drawing
    chart.draw();
});
​
function share(network) {
  switch(network) {
  case "facebook":
    chart.shareWithFacebook();
    break;
  case "twitter":
    chart.shareWithTwitter();
    break;
  case "linkedin":
    chart.shareWithLinkedIn();
    break;
  case "pinterest":
    chart.shareWithPinterest();
    break;
  }
};