Export data from Silverlight PivotViewer to WPF or Excel

http://www.youtube.com/watch?v=XdSjuulV4-E

 

PT: (english version below)

Eu adoro o meu trabalho, além de trabalhar com tecnologias que têm imensas pontencialidades, quase todas as semanas aparece um ou outro desafio para puxar pela minha imaginação e experimentar novos métodos para os resolver. O desafio desta vez era usar o novo controlo de silverlight PivotViewer dentro da nossa aplicação wpf e exportar os resultados de várias pesquisas feitas dentro deste controlo para a própria aplicação e para o excel.

Para começar colocar o PivotViewer dentro wpf é bastante fácil, basta usarmos o webbrowser e navegar ate o link com a aplicação silverlight, até aqui tudo bem. Quem já conhece o PivotViewer sabe que é uma óptima ferramenta para visualizar grande colecções de informação, navegar dentro destas colecções usando filtros até descobrimos a informação que pretendemos, tudo com o auxilio da tecnologia DeepZoom que permite a visualização rápida e fluida de grandes imagens. Aconselho vivamente quem não conhece a investigar mais em http://www.getpivot.com/

Depois de termos a informação que queremos, guarda-la e utiliza lá para algo é por vezes vezes uma necessidade, como era neste caso. Para isso investiguei e descobri duas formas de sabermos essa informação depois de filtrada :  A primeira maneira é sabendo o userstate do pivotviwer, basicamente é uma string que quarda a informação  dos filtros e  pode ser adcionada ao url para passar o estado da  do pivotviewer na aplicação a dada altura, ou seja os items que estão visiveis no ecra depois de alguns filtros. A segunda maneira, é atraves da propriedade do PivotViewer.InScopeItemsIds que nos devolve os ids dos items que estão a ser visualizados naquela altura, esses id’s são únicos no ficheiro cxml que representa a colecção Eu optei pela segunda opção, sabendo estes ids, eu só tinha que procurar esses ids no ficheiro e retirar a informação desses items. Para tornar isto uma realidade depois de trocar algumas ideias através do twitter conclui que a melhor maneira de passar essa informaçao para o wpf era atraves do uso do javascript e com interop entre a página que alojava o silverlight o usercontrol wpf que continha o webrowser. Depois tendo essa informação dos id’s em wpf era so usar linq to xml para ir buscar os items e as suas propriedas ao ficheiro da colecção, criar uma source com esses dados e usa-la na minha datagrid. Dai para o excel era fácil pois já tinha uma extensão para a datagrid que usava Com Interop para facilmente exportar os dados para o Excel. No fundo e uma solução foi bastante simples, demorou um dia a resolver, mas afinar demorou mais um bocadinho. Ainda adicionei a possiblidade do utilizador escolher quais os dados que quer exportar.

Para conseguir o resultado final contribuiu claro o nosso amigo Google, a documentação do msdn e a comunidade de wpf/silverlight espalhada pela a web que já tem milhares de pequenos projectos uteis, de salientar os blog de Jeremiah Morrill e Denis Gladkikh.

http://jmorrill.hjtcentral.com/

http://outcoldman.ru/en/blog/show/201

 

Um pequeno video da aplicação e algum código no inicio de post.

 

 

EN:

I love my job, besides working with technologies that have great potentialities, almost every week a new challenge appears and i have to use my imagination and try new methods to solve it. The challenge this time was to use the new silverlight control PivotViewer within our WPF application and export the results of several studies made within this control to the application itself and to excel.

To begin putting the PivotViewer in WPF is quite easy we just have to use the webbrowser and navigate to the link of the silverlight application, so far so good. People that have seen PivotViewer in action already know it’s a great tool for visualizing large collections of information, navigate within these collections using filters to find the information you want, all with the help of DeepZoom technology that allows fast and fluid visualization of large images. I urge those that not know this tool to investigate further into http://www.getpivot.com/.

Once we have the info you want, save it and use it for something is often times a necessity, as it was in this case. For that I investigated and found two ways to know this information after filtered: The first way is knowing the userstate of PivotViewer, this is basically a string that grabs and codes the filters done in the information and can be dropped in the url to pass the state of pivotviewer in a given time, in other words the items that are visible on the screen after a few filters. The second way is by looking on PivotViewer.InScopeItemsIds property that returns the ids of the items being displayed at that time, these ids are unique in XXML file that represents the collection I chose the second option, knowing these ids, I just had to look for these ids in the file and grab the information of these items. To make this happen, after exchanging ideas via twitter I concluded that the best way to pass this information to the WPF was through the use of javascript and with interop between the page that hosts the Silverlight and the wpf usercontrol containing the webrowser. After having this information with the ids in WPF I just needed to usse LINQ to XML to fetch the items and their info from the file collection, create a source with this data and use it in my datagrid. Export this to Excel was easy because I had already an extension to the datagrid that used with com interop to easily export data to Excel. In the end the solution was quite simple, it took a day to solve, but it took a little more to fine tune it. I also added the possibility of the user to choose which data want’s to export.

To achieve the end result it helped our friend Google, the MSDN documentation and the community of WPF / Silverlight spread across the web that already has thousands of small useful projects specially the blogs of Jeremiah Morrill and Denis Gladkikh.

 

http://jmorrill.hjtcentral.com/

 

http://outcoldman.ru/en/blog/show/201

 

Small video of the application and some code in the top of post.