How to control the icon visibility: by click icon A to make polyline B invisible?

[chao]

hi nick,

I am working on a project that show some cities' connection on timemap.

What I want to do is  I have  three cities A,B,C, and poyline B->A,C->A I want to click icon A to show and hide the two polyline.

Is there any one know how to do this?

I know you can assign item.visible to false and trigger the tm.filter("timeline"); and tm.filter("timemap"). But the question is how to make it possible to click A and hide polyline B->A C->A and where did all the icons store? I look at the source code of timemap and seems there are some thing like placemarker, placemarkers, item. And their array length are 1! which makes me confuse. 

I need a function like: var line=findline(destination A, all item);

this will return a array or just one object of line(s)

so question becomes: where are the all items? Sorry for so many questions, I was reading the source code for whole day and really need some help.

[Nick Rabinowitz]

Hi Chao -

Sorry for the slow response.

The items are all in tm.datasets, each member of which is a TimeMapDataset object with an items array. Each item can have one or more placemarks - one is the default, but you can have more.

There are various ways to do what you describe. I'd probably do this using filters, as described here: https://code.google.com/p/timemap/wiki/FilterTutorial

Instead of tags, you could load the items like this (this is assuming data in JSON):

items: [

  { title: "My Point", point: { lat: ... , lon: ... }, options: { id: 'my_item'}},

  { title: "Line to My Point", polyline: [...], options: { pointId: 'my_item' } },

  ...

]

Now maintain an array or other data structure with all of the points whose lines should be shown:

var showLines = ['my_item', ...];

and add a filter that checks this list:

var showLine = function(item) {

  // if you have a pointId, show the item only if its point is supposed to be visible

  return showLines.indexOf(item.opts.pointId) >= 0 || !item.opts.pointId; 

}

tm.addFilter("map", showLine);

now when you call tm.filter('map'), it will show/hide the lines as desired.

-Nick

--
You received this message because you are subscribed to the Google Groups "Timemap.js Development" group.
To view this discussion on the web visit https://groups.google.com/d/msg/timemap-development/-/V4iqgPQbYzMJ.
To post to this group, send email to timemap-d...@googlegroups.com.
To unsubscribe from this group, send email to timemap-develop...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/timemap-development?hl=en.