score:0
sorry that's the complete javascript function :
var data = **data** ;
function onlyunique(value, index, self) {
console.log(value, index, self);
return self.indexof(value) === index;
}
var year;
var dates = data.map(function (e) {
var date = new date(e.data.date);
year = date.getfullyear();
var month = date.tolocalestring('default', {
month: 'long'
})
return moment(date).format("mmm");
});
var allproducts = data.map(function (e) {
return e.data.categorie
});
var products = allproducts.filter(onlyunique);
var array = [];
products.foreach(function (e, i) {
var prod = e;
var list = data.filter(function (e) {
return e.data.categorie === prod
})
console.log(list);
var s = list.map(function (e) {
return e.data.price
});
var obj = {
name: e,
data: s
};
array[i] = obj
return array
})
console.log(array);
var categories = dates.filter(onlyunique);
var series = array;
var options = {
series: series,
chart: {
type: "bar",
height: 500,
stacked: true,
events: {
click: function (event, chartcontext, config) {
window.filemaker.performscript("event","hi");
console.dir(chartcontext);
console.dir(config)
}
}
},
datalabels: {
enabled: true,
style: {
colors: ['#333'],
fontsize: '10px'
},
},
plotoptions: {
bar: {
horizontal: false,
startingshape: 'flat',
endingshape: 'flat',
columnwidth: '90%',
datalabels: {
position: 'bottom',
orientation: 'horizontal',
maxitems: 20
}
},
},
stroke: {
width: 0
},
title: {
text: "product sales for " + year,
},
xaxis: {
categories: categories,
labels: {
style: {
fontsize: '16px'
}
}
},
yaxis: {
title: {
text: undefined,
labels: {
formatter: function (val) {
return val;
},
},
},
},
tooltip: {
y: {
formatter: function (val) {
return val;
},
},
},
fill: {
opacity: 1,
},
legend: {
position: "top",
horizontalalign: "left",
offsetx: 40,
},
};
var chart = new apexcharts(document.queryselector("#chart"), options);
chart.render();
Source: stackoverflow.com
Related Query
- Mapping data from JSON not parsing well
- Chart not displaying from JSON data
- Receiving json data from a server to display a chart.js graph not working
- Data not displaying in Chart JS from PHP JSON
- Not being able to display value from json data into chart js
- Chartjs Data via json request not populating
- Parsing JSON data into Chart.js bar chart
- Multiple lines / data series from JSON file with Chart.js
- Chart.js load new data from saved JSON object
- format JSON data for chart.js from Angular 4 observable
- Chartjs not working with d3 from csv source
- chart js chart bar chart not showing data from 0
- How can I show JSON data in Chart.js with Javascript if static values are working but dynamic from mySQL are not?
- Chart.js not updating or receiving data from Flask python
- Load data from a JSON object into an array
- Converting JSON data into Chart.js array from strings
- Populating Chart.Js line graph with multiple lines using data from a JSON Object
- Passing JSON data from PHP array into ChartJS
- Chart js data decimation not working, parsing issue
- chart js not dispalying data array that comes from an axios request
- Parsing values from external JSON file with Chart.js
- Updating chart.js not working after recieved new data from database with ajax
- Why is my data on chartjs not starting from the data that it should
- Chart.js not rendering chart with data from mySQL database
- Angular6 and ng2-charts does not display any charts when i fill data from webservice
- get JSON data from function to give value to Chart JS
- How to properly unpack data from PHP array encoded as JSON from a JavaScript file
- I'm trying to get data from flask app but I get this "Uncaught ReferenceError: _data is not defined"
- Chart.js using json data from MySQL
- ionic display chartjs data from json http request
More Query from same tag
- Chart.js bubble chart changing dataset labels
- x-Axis not working because I'm not using correctly moment.js
- How to add panning to chart in chartjs?
- Chart doesn't render in angular 2 app
- chartjs line graph points with different color
- How to incorporate chart.js in jsp file
- How to use chartjs-plugin-datalabels for specific charts using vue-chart.js
- Chart.js, PHP and radar chart labels
- Multiple usage of Javascript function
- Unable to separate elements of JSON
- Chart.js sync legend toggle on multiple charts
- Extending Existing Chart Types angular chart js using chart js 2.0
- Display JSON data in chartjs
- Radar chart Display legend
- Get value of min/lowest label from y-axis chart
- Creating a real time line chart using chartjs and firebase realtime db
- ChartJS with Dynamic Colors
- chart.js Radar shows 0 when value is 12
- Chart.Js Doughnut not calculating JSON data properly
- Missing colors in my Chart.js, my data looks fine, but no color
- Charts.js rendering issue on page load
- chart.js stacked graph that overlaps
- How do I add different data in my new chart?
- chart js in an especific label
- ChartJS Legend Not Lining Up
- ng2charts using borderColor with array value
- Combine\Merge Same Label in Pie Chart
- who know how to put down the title of pie in ionic 2
- How to map multiple charts with chart.js in react
- How to add an on click event to my Line chart using Chart.js