score:1
Accepted answer
it's possible with highcharts
, documentation
e.g.
$(function () {
data = [{
valsecond: 25,
valfirst: 62.5
}];
// build the data arrays
var seconddata = [];
var firstdata = [];
for (var i = 0; i < data.length; i++) {
// add second data
seconddata.push({
name: "second",
y: data[i].valsecond,
color: "#00ff00"
});
// add first data
firstdata.push({
name: "first",
y: data[i].valfirst,
color:'#ff0000'
});
}
// create the chart
$('#container').highcharts({
chart: {
type: 'pie'
},
title: {
text: ''
},
plotoptions: {
pie: {
animation: false,
shadow: false,
center: ['50%', '50%']
}
},
tooltip: {
valuesuffix: '%'
},
series: [{
name: 'second',
data: seconddata,
size: '30%',
startangle: 270,
endangle: 360,
innersize: '20%'
}, {
name: 'first',
color:'#ffffff',
data: firstdata,
size: '80%',
startangle: 0,
endangle: 225,
innersize: '60%',
}]
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>
<div id="container" style="width: 600px; height: 400px; margin: 0 auto"></div>
score:1
in the highcharts you can adapt donut chart http://www.highcharts.com/demo/pie-donut, remove connectors, set usehtml for datalabels and rotate by css / rotation svg element. missing elements can by added by renderer.
Source: stackoverflow.com
Related Query
- Double donut-like chart with negative values
- Highcharts: having trouble recreating stacked area chart from Excel with positive and negative values
- Highcharts - Area Chart - Stacking with series containing negative and positive values
- Column chart with negative values and categories on xAxis in HighCharts
- Highcharts - Pie chart with negative values
- Highcharts - Keep Zero Centered on Y-Axis with Negative Values
- Highcharts - best way to handle and display zero (or negative) values in a line chart series with logarithmic Y axis
- Highcharts Column chart with drilldown, remove hyperlink like formatting from x-axis labels
- Highcharts - Column With Negative Values - Column Color
- Highcharts - Issue with negative values when displaying multiple axes
- Highcharts - Negative color with 'line' type polar chart
- Creating negative stacking bar chart with Highcharter(Likert chart)
- logarithmic chart with 0 values
- Setting data with null values doesn't remove dots from the chart
- how to display the title in the middle of a donut chart with legend?(react-highcharts)
- how to develop custom chart with box annotations as like attached image
- Heat Map With Red Color Range For Negative Values And Green Color Range For Positive Values
- highcharts donut chart center text overlaps with tooltip
- Highcharts vertical stacked bar chart with negative values, is it possible?
- jQuery Highcharts double donut chart (donut within donut)
- Highcharts - Cannot set x-axes categories in column charts with negative values
- Highcharts gantt chart : Task progress indicator need to show a single task for various status like completed,inprogress etc with different colors
- How to display the total of the series values for a donut chart in Highcharts?
- Highcharts - draw line chart with summed values but show breakup on hover
- Array split with the help of object categories values of array- Javascript - High Chart
- Highcharts - Dealing with small values in Funnel chart
- How to draw a bar chart that one series has both positive and negative values in Highcharts?
- highcharts lollipop/dumbbell chart change position/colour of positive and negative marker values
- Highcharts Semi Donut Pie with Negative Percentage
- HighCharts: How to draw a straight line in multiple axes like plotLines with fixed X-axis with different values
More Query from same tag
- Dynamically hide or show legend in highchart
- Any chart library for funnel chart instead of highchart?
- Data not appearing in HighChart
- How to provide additional arguments to custom symbol renderer in Highcharts?
- HighCharts show selected point from chart on Pie Chart
- Highcharts - Tooltip and series name are out of their boxes in chrome
- highcharts stockchart 1m and 3m not enabled
- How can I do in Highchart to have 1px space between the columns and the y Axis?
- Highcharts/Highstock DataGrouping & Approximation
- Set backgroundColor on half of the highchart area?
- Highcharts yaxis labels not working
- Resize specific chart
- tickmarkPlacement 'between' doesn't work
- highcharts - avoid repeating same date on x axis with different time
- Bar chart not drawn when chart renders
- Formating dollars with commas on Highcharts
- While loop not working in the series data highcharts - php
- How to remove white space from pie chart in highchart.js?
- Highcharts column chart, disable interpolation when loading from data table
- Can highcharts drilldown of a chart, reflect on another chart?
- Highchart js zoom remove labels of series from legend
- Can we show the text in bar of timeline chart?
- Styling issues with Highcharts JS
- SpagoBI: create a dynamic chart using SpagoBI
- Getting data from mysql and drawing a chart
- How to add extra tears(ticks) in highcharts?
- Could not install package 'HighChart" in a .Net webform project
- Json quotes highcharts
- Printing table with charts in html through FireFox
- Highcharts, MySql and Vaadin