After creating custom app, I created a New Page. Then I go to its js file and add this code.
frappe.pages['dash1'].on_page_load = function(wrapper) {
var page = frappe.ui.make_app_page({
parent: wrapper,
title: 'Dashboard',
single_column: true
});
console.log(page)
page.add_menu_item('Projects', () => frappe.set_route('List', 'Project'))
const graph = new frappe.ui.Graph({
height: 140,
parent: page.main,
mode: 'line',
x: {
values: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul',
'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
y: [{
values: [23, 34, 23, 56, 83, 2, 92, 1, 90, 34, 67, 78]
}]
});
}
Page title and menu showing on the page but no graph displaying there. Can anyone tell me the reason or highlight my mistake.
nikzz
#2
Check in console (via debugger) whether frappe.ui.Graph exists or not
there is new frappe.Chart instead of frappe.ui.Graph
https://frappe.io/charts/docs/basic/basic_chart
Should try this.
nikzz
#4
See this
not exist
what will be the issue and how to tackle it.
Hi @bhavikpatel7023
As per your instructions I use this link. You can see this is a code that I used here.
frappe.pages['dash1'].on_page_load = function(wrapper) {
var page = frappe.ui.make_app_page({
parent: wrapper,
title: 'Dashboard',
single_column: true
});
page.add_menu_item('Projects', () => frappe.set_route('List', 'Project'))
new frappe.Chart("#chart", {
data: data,
type: 'bar',
height: 140,
colors: ['red']
});
data = {
labels: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
datasets: [{
values: [18, 40, 30, 35, 8, 52, 17, -4]
}]
}
}
Output you can see by yourself.
No graph is showing here. Actually this is the issue. Can you please help me at this point. I will be very thankful to you.
There are two things I think you’re having a problem with.
- If this is a frappe app, charts is built in so don’t get it from a CDN - it’s already there.
- It can take longer to load than the doctype so you need to run it serially. (this example is datatable, but same idea)
Hi @tmatteson
I installed custom app and make it default.
It about 1 hour going and I refreshed it many time but nothing is there till now. This is showing in console.
Any suggestion please.
rahy
#9
Try look at the DOM you use.
If it is a new empty page, it might have style=“display:none”.
This is my case, I don’t know why
