Next
Update
Prev
Default

An image chart ( or pictorial chart ) is a column chart in which the rectangular columns have been filled with pictures, or where pictures have been substituted for the rectangular columns. In both variations, one or more symbols can be used in each column.

The <ImageChart> element tag is used to create an image chart in KoolChart, and the series element tag for the image chart is <ImageSeries>.

This sample chart is to show how to create a varying-ratio type image chart.

...
<ImageChart ... >
  ...
  <series>
    <ImageSeries yField="Data1" imageDisplayType="single" ... >
      <imgSource>
        <ImageSourceItem maintainAspectRatio="false" url="../../KoolChart/Assets/Images/visit_human.png" />  
      </imgSource>
      ...
    </ImageSeries>
  </series>
  ...
</ImageChart>
...

<ImageSeries>

yField The yField attribute determines the field name of the vertical axis (verticalAxis).
imageDisplayType The imageDisplayType attribute determines the display method of the image. The valid values are "single", "singleRepeat", "multiple", and the default value is "single".

<ImageSourceItem>

maintainAspectRatio The maintainAspectRatio attribute determines whether or not to maintain the original size of the image. If maintainAspectRatio="true", then the unused space will be filled with a bar.
url The url attribute is used to set the directory and name of the image file.

© 2017 KoolChart. All rights reserved.