-
Notifications
You must be signed in to change notification settings - Fork 59
Description
Hi, I am new at programming and I just started a Flask project related to Stock Market. In the chart under "function Stock_Performance_Chart2()" I am using the plugin but it doesn't seem to work (All the different lines of the chart posses the same color i.e. Grey). Can you please help me regarding this. I will be very thankful if you do so.
`function initialize(){
var active = "Active";
$.ajax({ url : '/api/initialize/user_check?JsStatus=' + active,
success: function (data) {
var user = data['user'];
var firsttime = "yes";
var olduser = "no";
var modified = "error";
if (user == firsttime){
window.location.replace("http://127.0.0.1:5000/First_Login");
}else if (user == olduser){
window.location.replace("http://127.0.0.1:5000/Scratch_start_1");
}
}
});
}
$('#quickstart').click(function() {
window.location.replace("http://127.0.0.1:5000/quick_start_form");
});
function QuickStartSave(){
$.ajax({ url: '/api/quick_start_form?First_Name=' + document.getElementById('First_Name').value + '&Last_Name=' + document.getElementById('Last_Name').value + '&Tickers=' + document.getElementById('Tickers').value + '&Start_Date=' + document.getElementById('Start_Date').value + '&End_Date=' + document.getElementById('End_Date').value + '&Total_Investment_Amount=' + document.getElementById('Total_Investment_Amount').value + '&Amount_Allocation_raw=' + document.getElementById('Amount_Allocation_raw').value,
success: function(data){window.location.replace("http://127.0.0.1:5000/quick_start_analytics")}
});
}
function Quick_Start_Analytics(){
var temp = "x";
$.ajax({ url : '/api/quick_start_form/analysis_and_optimistaion?x=' + temp,
success: function (data) {
$('#Portfolio_Annual_Return_Percent').html(data['Portfolio_Return_Percent'] );
$('#Current_Portfolio_Value').html('$' + data['Current_Portfolio_Value']);
$('#Sharp_Ratio').html(data['Sharp_Ratio']);
$('#Portfolio_Volatility').html(data['Portfolio_Volatility_Data']);
$('#Portfolio_Varience').html(data['Portfolio_Varience_Data']);
$('#Annual_Sharp_Ratio').html(data['Annual_Sharp_Ratio']);
$('#Cumulative_Return').html(data['Cumulative_Return']);
$('#Profit_Amount').html('$' +data['Profit_Amount']);
Portfolio_Performance_Chart1();
Stock_Performance_Chart2();
}
});
}
function Portfolio_Performance_Chart1(){
$.ajax({ url : '/api/quick_start_form/analysis_and_optimistaion',
success: function (data) {
var ctx = document.getElementById('Chart-1')
var chart = new Chart(ctx, {
type: 'line',
data: {
labels: data.Portfolio_Performance_Yaxis_Data,
datasets: [{
label: 'Portfolio Performance',
borderColor: '#4B4B4B',
data: data.Portfolio_Performance_Xaxis_Data,
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
elements: {
point:{
radius: 2
}
}
}
});
}
});
}
function Stock_Performance_Chart2(){
var TITLE = 'Individual Stock Performance';
var X_AXIS = 'Time Period'; // x-axis label and label in tooltip
var Y_AXIS = 'Price Normalized to 100'; // y-axis label and label in tooltip
var BEGIN_AT_ZERO = false; // Should x-axis start from 0? true or false
var SHOW_GRID = true; // true to show the grid, false to hide
var SHOW_LEGEND = true; // true to show the legend, false to hide
$(document).ready(function() {
// Read data file and create a chart
$.get('/return-files', function(csvString) {
var data = Papa.parse(csvString).data;
var timeLabels = data.slice(1).map(function(row) { return row[0]; });
var datasets = [];
for (var i = 1; i < data[0].length; i++) {
datasets.push(
{
label: data[0][i], // column name
data: data.slice(1).map(function(row) {return row[i]}), // data in that column
fill: false // `true` for area charts, `false` for regular line charts
}
)
}
// Get container for the chart
var ctx = document.getElementById('chart-container').getContext('2d');
new Chart(ctx, {
type: 'line',
data: {
labels: timeLabels,
datasets: datasets,
},
options: {
title: {
display: true,
text: TITLE,
fontSize: 14,
},
legend: {
display: SHOW_LEGEND,
},
maintainAspectRatio: false,
scales: {
xAxes: [{
scaleLabel: {
display: X_AXIS !== '',
labelString: X_AXIS
},
gridLines: {
display: SHOW_GRID,
},
ticks: {
callback: function(value, index, values) {
return value.toLocaleString();
}
}
}],
yAxes: [{
beginAtZero: true,
scaleLabel: {
display: Y_AXIS !== '',
labelString: Y_AXIS
},
gridLines: {
display: SHOW_GRID,
},
ticks: {
beginAtZero: BEGIN_AT_ZERO,
callback: function(value, index, values) {
return value.toLocaleString()
}
}
}]
},
tooltips: {
displayColors: false,
callbacks: {
label: function(tooltipItem, all) {
return all.datasets[tooltipItem.datasetIndex].label
+ ': ' + tooltipItem.yLabel.toLocaleString();
}
}
},
plugins: {
colorschemes: {
scheme: 'brewer.PuRd4'
}
}
}
});
});
});
} `