Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Treemap feedback #1674

Closed
jarben opened this issue Jun 14, 2015 · 8 comments

Comments

Projects
None yet
3 participants
@jarben
Copy link
Contributor

commented Jun 14, 2015

I've been playing with the new treemap chart and noticed few things:

  • I'm not able to show labels on sub items (the drill down example)
  • There is 1px border when using childBorderWidth:0, should be 0. Setting anything different that 0 works as expected.
  • I can't get rid of the text at the left bottom corner (the breadcrumb?), shows the name property in the series, I need to set name:''. I've tried breadcrumb:{show:false} but that doesn't help

Anyway, really glad to see all the new charts in 2.2.3!

@loutongbing

This comment has been minimized.

Copy link
Contributor

commented Jun 16, 2015

hi thank you for using the treemap chart.
please give me your options that can not work.

@jarben

This comment has been minimized.

Copy link
Contributor Author

commented Jun 18, 2015

Hi, here is the code:
{
"series": [
{
"name": "test",
"type": "treemap",
"itemStyle": {
"normal": {
"label": {
"show": true,
"formatter": "{b}"
},
"childBorderWidth": 0,
"childBorderColor": "#ffffff",
"borderWidth": 0,
"borderColor": "#ffffff"
},
"emphasis": {
"label": {
"show": false
}
}
},
"data": [
{
"name": "Monday",
"children": [
{
"name": "test1",
"value": 10
},
{
"name": "test2",
"value": 20
},
{
"name": "test3",
"children": [
{
"name": "test a",
"value": 10
},
{
"name": "test b",
"value": 20
},
{
"name": "test c",
"value": 30
}
],
"value": 30
}
],
"value": 100
},
{
"name": "Tuesday",
"value": 20
},
{
"name": "Wednesday",
"value": 40
},
{
"name": "Thursday",
"value": 60
},
{
"name": "Friday",
"value": 60
},
{
"name": "Saturday",
"value": 75
},
{
"name": "Sunday",
"value": 70
}
]
}
]
}

and here is the output:
image

  • childBorderWidth:0 should render child items without border
  • not sure how to display labels test1, test2, test3
  • seems like there are only two levels of data supported, test a, test b, test c is not considered
  • sorry, the breadcrumb:{show:false} works fine

Anyway, this is an awesome chart!

@loutongbing

This comment has been minimized.

Copy link
Contributor

commented Jun 19, 2015

I will research it. Please wait for days.

@loutongbing

This comment has been minimized.

Copy link
Contributor

commented Jun 24, 2015

  • I have fixed the bug of childBorderWidth:0. You will see it in the next version.
  • not support to display sub labels and sub sub data, because we cant find a good way to show them. You have to make use of drilling down
    My English is not so good. If you cant understand, you can commit again :)
@jarben

This comment has been minimized.

Copy link
Contributor Author

commented Jun 27, 2015

Thanks for that!
Regarding sub data, what if you do something that d3.js does, for example:

image

the structure of this tree map is:
root
- button
- tabset
- tab
- tab
- button
- button

Which means parents with children don't show label - they are just containers. This allows better control of how things group.

Thanks again!

@jarben

This comment has been minimized.

Copy link
Contributor Author

commented Jun 27, 2015

sorry, the structure got flatten after commenting, here is a snip:

image

@loutongbing

This comment has been minimized.

Copy link
Contributor

commented Jun 29, 2015

we dont support it now. sorry.

@jarben

This comment has been minimized.

Copy link
Contributor Author

commented Jul 1, 2015

no problem - thanks a lot for the border fix in 2.2.5!

@pissang pissang closed this May 21, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.