Свободное пространство

Archive for April, 2007

Файлы Excel с диаграммами и без.

Sunday, April 8th, 2007

Excel таблицы создавать проще чем казалось бы. Нынешние MS Office средства позволяют создавать подобные таблицы с диаграммами используя симбиоз технологий HTML + XML+ VML

Итак. Для создания простой таблицы с данными создаём файл, который содержит:

<html>
  <body>
    <table>
      <tr>
        <td>1</td>
      </tr>
      <tr>
        <td>2</td>
      </tr>
      <tr>
        <td>3</td>
      </tr>
      <tr>
        <td>4</td>
      </tr>
    </table>
  </body>
</html>

Сохраним файл под именем excelfile.xls, откроем его с помощью MS Excel и получим результат:

Как видно - результат ничем не отличается от варианта создания файла в самом MS Excel за исключением разграничения ячеек сероватым стандартным цветом. Для того, чтобы исправить этот “баг” (или фичу) вносим следующие правки:

<body style="border:.5pt solid silver;">

Для того, чтобы использовать формулы в таблицах - определяем xml namespace urn:schemas-microsoft-com:office:excel:

<html
    xmlns:x="urn:schemas-microsoft-com:office:excel">

Далее пример использования функции SUM (сумма) и простого сложения значений ячеек с использованием нового аттрибута x:fmla:

<html
     xmlns:x="urn:schemas-microsoft-com:office:excel">
  <body style="border:.5pt solid silver;">
    <table>
      <tr>
        <td>1</td>
      </tr>
      <tr>
        <td>2</td>
      </tr>
      <tr>
        <td>3</td>
      </tr>
      <tr>
        <td>4</td>
      </tr>
      <tr>
      	<td style="width: 48pt"
             x:fmla="=SUM(A1:A4)"></td>
      </tr>
      <tr>
        <td x:fmla="=A1+A2"></td>
      </tr>
    </table>
  </body>
</html>

Я добавил ещё определение ширины для ячейки, где выводится сумма style=”width: 48pt” (48pt - это стандартная ширина ячейки в excel):

Добавляем диаграмму:
Дописываем ещё один namespace:

<html xmlns:x="urn:schemas-microsoft-com:office:excel"
        xmlns:v="urn:schemas-microsoft-com:vml">

И после определения таблицы дописываем кусок xml кода

<!--[if gte vml 1]>
<v:shape style='position:absolute; width: 600px;
height: 400px'>
   <x:ClientData ObjectType="Chart">
    <x:WebChart>
     <x:Scaling>
      <x:ScaleID>0</x:ScaleID>
      <x:Orientation>MinMax</x:Orientation>
     </x:Scaling>
     <x:Scaling>
      <x:ScaleID>1</x:ScaleID>
      <x:Orientation>MinMax</x:Orientation>
     </x:Scaling>
     <x:Chart>
      <x:Title>
       <x:Caption>
        <x:DataSource>-1</x:DataSource>
        <x:Data>&quot;<x:B>Name of diagram</x:B>&quot;
        </x:Data>
       </x:Caption>
       <x:Border>
        <x:ColorIndex>None</x:ColorIndex>
       </x:Border>
      </x:Title>
      <x:PlotArea>
       <x:Interior>
        <x:ColorIndex>14</x:ColorIndex>
       </x:Interior>
       <x:Graph>
        <x:Type>Line</x:Type>
        <x:SubType>Standard</x:SubType>
        <x:ScaleID>0</x:ScaleID>
        <x:ScaleID>1</x:ScaleID>
        <x:Series>
         <x:Index>0</x:Index>
         <x:Caption>
          <x:DataSource>-1</x:DataSource>
          <x:Data>&quot;Line 1&quot;</x:Data>
         </x:Caption>
         <x:Category>
          <x:DataSource>0</x:DataSource>
          <x:Data>excelfile!$B$1:$B$6</x:Data>
         </x:Category>
         <x:Value>
          <x:DataSource>0</x:DataSource>
          <x:Data>excelfile!$A$1:$A$6</x:Data>
         </x:Value>
        </x:Series>
       </x:Graph>
       <x:Axis>
        <x:Placement>Bottom</x:Placement>
        <x:AxisID>0</x:AxisID>
        <x:ScaleID>0</x:ScaleID>
        <x:Title>
         <x:Caption>
          <x:DataSource>-1</x:DataSource>
          <x:Data>&quot;<x:B>Axis X</x:B>&quot;
          </x:Data>
         </x:Caption>
         <x:Border>
          <x:ColorIndex>None</x:ColorIndex>
         </x:Border>
        </x:Title>
        <x:Type>Category</x:Type>
       </x:Axis>
       <x:Axis>
        <x:Placement>Left</x:Placement>
        <x:AxisID>1</x:AxisID>
        <x:ScaleID>1</x:ScaleID>
        <x:MajorGridlines/>
        <x:Title>
         <x:Caption>
          <x:DataSource>-1</x:DataSource>
          <x:Data>&quot;<x:B>Axis Y</x:B>&quot;
          </x:Data>
         </x:Caption>
         <x:Border>
          <x:ColorIndex>None</x:ColorIndex>
         </x:Border>
        </x:Title>
        <x:Type>Value</x:Type>
       </x:Axis>
      </x:PlotArea>
      <x:Legend>
       <x:Placement>Right</x:Placement>
      </x:Legend>
     </x:Chart>
    </x:WebChart>
   </x:ClientData>
  </v:shape>
<![endif]-->

Это минимальный набор инструкций, которых необходимо для корректного отображения диаграммы. При просмотре XML всё становится понятным из названий тегов. Что на мой взгляд может показаться непонятным:

x:ClientData ObjectType=”Chart” - эта инструкция говорит о том, что это и есть именно диаграмма, а не другой какой-нибудь объект
Scaling - тут указываются два блока определений Scaling, для горизонтальной и вертикальной оси, MaxMin можно заменить на MinMax, тогда данные будут “отсортированы” от минимального к максимальному
x:DataSource - если DataSource равен 0, значит данные будут браться по указанной в x:Data ссылке из листа данных, если же равен -1, но данные записываются прямо в x:Data
x:Type - тут указывается тип диаграммы. В нашем случае это Line. Может быть например Bar, Pie и др.
Для добавления ещё одной линии данных нужно продублировать блок x:Series соответственно изменив блок с данными

Пример созданного файла: excelfile.zip

Posted in Programming | No Comments »

Archive for April, 2007

Файлы Excel с диаграммами и без.

Pages

Archives

Categories