AMREIN ENGINEERING SharePoint Web Parts   |   Office 365 Web Parts   |   Support   |   Search   |   About us   |   Home  
  AE Chart Sharepoint Web Part Deutsch English  


Sharepoint Web Parts  

Digital Clock Web Part  

Stock Chart Web Part  

Stock Quotes Web Part  

Dilbert Web Part  

Quote of the Day Web Part  

"Spotlight On.." Web Part  

"Tip of the Day" Web Part  

Lightbox Web Part  

Weather Web Part  

Slideshow Web Part  

Currency Rates Web Part  

Media Player Web Part  

YouTube Player Web Part  

Map Chart Web Part  

Org Chart Web Part  

Tiles Web Part  

Chart Web Part  

Google Chart Web Part  

Hero Web Part  

News Tiles Web Part  

RSS Feed Ticker Web Part  

SQL Viewer Web Part  

Google Map Web Part  

Quick Poll Web Part  

Quick Survey Web Part  

Audio Player Web Part  

Google GeoMapper Web Part  

SQL Chart Web Part  

Exchange Calendar Web Part  

Exchange Events Web Part  

Call to Action Web Part  

Quick Links Web Part  

Filter Web Part  

Image Rotator Web Part  

Navigator Web Part  

KPI Web Part  

Page Hits Web Part  

Picture Menu Web Part  

Timer Web Part  

Podcast Web Part  

SQL Bullet Graph Web Part  

User Spotlight Web Part  

List View Web Part  

Staff Directory Web Part  

Birthday Reminder Web Part  

News Carousel Web Part  

Team Members Web Part  

Classifieds Web Part  

Image Menu Carousel Web Part  

Timeline Web Part  

Banner Rotator Web Part  

AZ Index Web Part  

Blog Roll Up Web Part  

Discussion Roll Up Web Part  

Document Roll Up Web Part  

News Roll Up Web Part  

Task Roll Up Web Part  

Calendar Roll Up Web Part  

Quick Form Web Part  

Twitter Web Part  

Upcoming Events Web Part  

Welcome Web Part  

Color Calendar Web Part  

Image Carousel Web Part  

Metro Grid Web Part  

Goal Thermometer Web Part  

Swipe Gallery Web Part  

List Rotator Web Part  

List Search Web Part  

Bullet Graph Web Part  

Accordion & Tabs List Bundle  

Accordion List Web Part  

Tabs List Web Part  

Microblog/Chat Web Part  

Toast Notifications  

Vacation Planner Web Part  

Multilevel Tile Web Part  

Inspired Tiles Web Part  

Facebook Timeline Web Part  

Zip Creator  

Web Part Support  

Web Part Bundle  

Microsoft Sharepoint Web Parts

Chart Sharepoint Web Part



Chart Web Part

The Chart Web Part allows to chart data contained in the specified Sharepoint List. The charts are created using Google's public Chart API (see official Google Documentation)

The Web Part can be used with Windows Sharepoint Services V3, MOSS 2007, Sharepoint 2010, Sharepoint 2013, Sharepoint 2016 and Sharepoint 2019. 

The following parameters can be configured:

  • Sharepoint List containing the data to be visualized
  • Search Filters
  • Chart Type:
    • Pie Chart
    • 3D Pie Chart
    • Donut Chart
    • Horizontal Bar Chart
    • Vertical Bar Chart
    • Line Chart
    • Area Chart
    • Horizontal and Vertical Stacked Bars
    • Scatter Chart
  • Chart dimensions
  • Chart Title
  • Chart background colors
  • Chart Legend
  • Interactive Search Filters
  • Web Part Connection for filtering
Product Price
Chart Web Part for SP 2010
(Release 1.0.30)
Free download..
Chart Web Part for SP 2013
(Release 1.0.30)
Free download..
Chart Web Part for SP 2016
(Release 1.0.30)
Free download..
Chart Web Part for SP 2019
(Release 1.0.30)
Free download..
Chart Web Part
per Sharepoint WFE License
USD 150.00
Web Part Installation Instructions download..
Chart Web Part


Chart Web Part - Pie Chart


Installation Instructions:

  1. download the Chart Web Part Installation Instructions (PDF file, see above) 
  2. either install the web part manually or deploy the feature to your server/farm as described in the instructions.
  3. Either adapt an existing Sharepoint List or create a new Sharepoint List to store the data to be charted.
    Also optionally define a suitable List View for the List if you want to sort or filter the data in a specific way.
    The list should include a

    • column to hold the data values to be charted (see Data List Column Name setting below).
      The column should be a numeric type (Number or Currency).
      You can specify multiple data series by entering multiple List column names separated by commas (as eg. Sales 2018,Sales 2019)
    • column to hold the data labels to be used (see Label List Column Name setting below).

  4. Configure the following Web Part properties in the Web Part Editor "Miscellaneous" pane section as needed:

    • Site Name: Enter the name of the site that contains the Sharepoint List containing the data to be charted.
      - leave this field empty if the List is in the current site (eg. the Web Part is placed in the same site)
      - Enter a "/" character if the List is contained in the top site
      - Enter a path if the List is in a subsite of the current site (eg. in the form of "current site/subsite")
    • List Name: Enter the desired Sharepoint List containing the data to be charted.
    • View Name: Optionally enter the desired List View of the list specified above. A List View allows you to specify specific data filtering and sorting.
      Leave this field empty if you want to use the List default view.
       
    • Data List Column Name: enter the Sharepoint list column name of the column(s) containing the data to be charted. You can specify multiple data series by entering multiple List column names separated by commas (as eg. Sales 2018,Sales 2019)
    • Label List Column Name: enter the Sharepoint List column name of the column that contains the data labels to be used.
    • Aggregation Type: select the desired Aggregation type if you want to aggregate data:

      - none
      - Count
      - Sum
      - Group Sum
      - Average

      Examples using the List shown below:



      Example:
      Sum (by Title)

      sums the values (as specified in the Data List Column Name field) and groups the results by the Title column:


      Example:
      Count (by Title)

      counts the number of distinct entries in the Title column:



      Example:
      Average (by Title)

      sums the values (as specified in the Data List Column Name field), counts the number of distinct entries and groups the average by the Title column:


      You can append the data value to each label by adding the x placeholder to the "Label List Column Name" (separated by a colon). The placeholder can be surrounded by other characters.
      Example: append the data value to the labels, surrounded by parentheses:



      If the labels consist of dates, you can append a date formatting string to the column name (separated by a colon):
      Example: TradeDate:MMM-dd

      The following formatting options are available:

      d - Numeric day of the month without a leading zero.
      dd - Numeric day of the month with a leading zero.
      ddd - Abbreviated name of the day of the week.
      dddd - Full name of the day of the week.

      h - 12 Hour clock, no leading zero.
      hh - 12 Hour clock with leading zero.
      H - 24 Hour clock, no leading zero.
      HH - 24 Hour clock with leading zero.

      m - Minutes with no leading zero.
      mm - Minutes with leading zero.

      M - Numeric month with no leading zero.
      MM - Numeric month with a leading zero.
      MMM - Abbreviated name of month.
      MMMM - Full month name.

      t - AM/PM but only the first letter.
      tt - AM/PM ( a.m. / p.m.)

      y - Year with out century and leading zero.
      yy - Year with out century, with leading zero.
      yyyy - Year with century.


      You can append the data value as a percentage to each label by adding the % placeholder to the "Label List Column Name" (separated by a colon). The placeholder can be surrounded by other characters.
      Example: append the data value as a percentage to the labels, surrounded by parentheses:

      ProductName:(%)
    • Chart Type: select the desired chart type:
      - Pie
      - Pie3D
      - Donut
      - Line
      - VerticalBar
      - HorizontalBar
      - Vertical Stacked Bar
      - Horizontal Stacked Bar
      - Area
      - CombinedBarLine (combined vertical bar and line chart)
       

    • Chart Title: enter the desired Chart Title
    • Chart Width: enter the desired width of the chart in pixels. Enter "0" to have the web part use the available zone width.
    • Chart Height: enter the desired height of the chart in pixels.
    • Chart Color: enter the HTML color value(s) or the RGB Hex value(s) of the desired data series color. Specify one value for each data series (the values are separated by commas).
      Pie Charts: enter two (or more) colors (separated by commas) to specify the wedge colors.
      Separate multiple color values by commas.
    • Chart Background Color: enter the HTML color value or the RGB Hex value of the desired background color.
      The default value is #FFFFFF (white).
    • Chart Font Color: enter the HTML color value or the RGB Hex value of the desired text color.
      The default value is black.
    • Chart Legend Position: allows to control the placement of the chart legend if you display multiple data series (the chart legend is suppressed if only one data series is displayed)
    • Horizontal Axis Label: allows to add an optional x axis label (Bar and Line chart only).
    • Vertical Axis Label: allows to add an optional y axis label (Bar and Line chart only).
    • Center Chart: horizontally center the chart within the available space.
    • Search Filter(s): enter the desired List column name(s) to be used for interactive filtering.

      • enter the name(s) of the Sharepoint List column(s) to be filtered.
      • enter multiple filters separated by semicolons.
      • If you place an "@" ampersand character on front of the filter name, a combo box is used (as opposed to a text input box) which is automatically populated with the available List values.
      • The default input box sizes can be overridden by appending a number (separated by a colon) to the filter (number of characters for text boxes, pixels for combo boxes)
      • the default filter comparison operator ("contains") can be overridden for numeric values to either specify "greater than", "greater or equal", "less than" or "less or equal" or "equal" by adding either the ">", ">=", "<", "<=" or "==" suffix as follows:
        @Year<;Price>

      • each dropdown filter can optionally be sorted ascending by adding the "^" suffix as follows:
        @Month^
        and descending (from version 1.1.42):
        @Month
      • each dropdown filter can optionally be preset by adding the preset value as follows:
        @Month=April

      Example:
      @Title;@Month;Price:5

      displays the following 3 filter boxes:


      You can also connect the Chart Web Part to a Sharepoint Filter Web Part (Connections, Get Field From ...) and then adding the "$" prefix in the configuration field "Search Filter(s)" to the column to be filtered:
      Example:
      $Season


    • Footer: optionally display a custom Footer text below the chart (you can also embed HTML tags if needed).
    • License Key: enter your product license key (as supplied after purchase of the Chart web part license).
      Leave this field empty during the 30 day evaluation period.



Please enter a comment below if you have problems with the installation, want to give feedback or have suggestions for improvements:

User Comments Post a Comment 

Kemal Aydık  
4/11/2019 13:25 
Can this webpart be used on a SP2019 on premise modern page?
Juerg  
4/11/2019 13:52 
Kemal,
unfortunately not, since the web part is server-based (as opposed being created with the Sharepoint SPFx framework).
Ben  
5/7/2019 18:50 
How do you add additional parameters like in the previous google chart version? For example re-label the data field labels.
Juerg  
5/8/2019 12:51 
Ben,
what exactly do you mean by "re-label the data field labels" ?
Ben  
5/14/2019 18:51 
If my data column name = calValue, but I want the data label on the chart to display as "The Value" how can I do that within the Chart Web part. I was able to do this within the google chart web part in the extra google parameters section.
Juerg  
5/14/2019 20:21 
Ben,
I still do not completely understand.
Can you send a screen shot to support@amrein.com to illustrate the issue ?
Joseph  
5/22/2019 19:39 
How to we change the labels for the y axis to show as percent instead of decimals? When I change the data label with the :(%) it errors saying column not found.
Juerg  
5/23/2019 14:36 
Joseph,
to label the y-axis using percentages, please add the below to the web part's "Options" setting:

axisformat=percent
Joseph  
5/28/2019 18:22 
Hey Juerg - thanks for the follow-up. That doesnt seem to work for me. It does not update the axis labels. Does the column format need to be percent as well?
Juerg  
5/29/2019 11:17 
Joseph,
the column format does not need to be percent as well.
However, the "axisformat" option was added with version 1.0.13 on January 17, 2019, so you might need to update the web part if you use an older version.
Chris  
6/7/2019 17:26 
Hello and thanks for the great webpart!
How do you supress the data callouts and add the data value on top of the bar? The ProductName:(x) doesn't appear to work for multiple data list columns.
Matt  
6/11/2019 17:04 
I'm curious about displaying the values on the chart as well, instead of the hover callouts. Is that possible?
Andreas  
6/13/2019 15:20 
Hey Juerg, as Joseph i had the problem to format the y-axis (vaxis) as percent. Try "axisformat=percent" but no success. I use AE chart Web Part Version 1.0.16. Is there an example or list of the options to use?
Juerg  
6/13/2019 18:14 
Chris and Matt,
we have now added the new “annotate” option to display the chart values on top of the data points. It is enabled by adding the below to the web part’s “Options” setting:

annotate=1



Please re-download the AE Chart web part and then update the solution.
Juerg  
6/14/2019 15:07 
Andreas,
please note that versions prior to V1.0.18 also require to enter a value into the "Vertical Axis Label" in order to honor the "axisformat" option.
Agape  
8/23/2019 21:39 
Hi, this webpart looks amazing. Is it possible to have a scatterplot?

Thanks!
Agape
Juerg  
8/25/2019 14:53 
Agape,
we have now added the new „Scatter“ chart type:



Data List Column Name:
x-Axis,y-Axis
(eg. enter the name of the x-Axis and the y-Axis, separated by a comma)

Label List Column Name:
leave empty

Chart Type:
Scatter

If you already installed the web part, please re-download it and then update the solution.
Julio  
9/23/2019 19:30 
How can you make the y-axis show tenths and hundredths instead of just whole numbers?

Thankyou
Juerg  
9/24/2019 12:20 
Julio,
the web part automatically chooses an optimal y-axis grid.
Is this not the case in your configuration ?
If so, can you send a screen shot of the chart to support@amrein.com  ?
Jazer  
10/4/2019 08:09 
How to sort data values in the graph e.g. descending
Jazer  
10/4/2019 08:11 
Also, if possible to hide not applicable data in the graph.. Thanks so much!
Juerg  
10/4/2019 15:38 
Jazer,
please create a list view with the desired sort order and then enter the view name into the web part’s “View Name” setting.
Juerg  
10/4/2019 15:45 
Jazer,
what exactly do you mean by „not applicable data“ ?
Wyatt  
10/21/2019 15:10 
Can I change the size and font of the Horizontal Axis and Vertical Axis label.
Juerg  
10/21/2019 16:02 
Jon,
it is possible to set the font size of the axes labels by adding the below to the web part’s “Options” setting:

axisLabelFontSize=15

(the above example sets the axis label font size to 15pt).

However, currently the font family is hard-coded to “Arial”.
Would it be important for you to set an alternate font family ?
Tobi  
11/19/2019 15:51 
Hello,

is it possible to move annotations to a different position somehow?
Right now when values are 0/null, the "0" overlaps with real values in some chart types.
Like this: https://i.imgur.com/zNx61DE.png

-Tobi
Juerg  
11/19/2019 17:09 
Tobi,
this issue has now been fixed (eg. the annotations are now suppressed for values being zero).
Please re-download the web part and then update the solution.
Danny   
11/20/2019 19:07 
Is this the AE google chart? (with the bundle). I dont appear to have the 'Aggregation Type' field.

What i am trying to achieve is create a chart that displays the number of documents in a library by split by author field

so X would be author
and Y would be display the number of documents in that library by that particular author

Can you help?
Juerg  
11/20/2019 19:46 
Danny,
please make sure to install the "Chart" web part (the one described on this page as opposed to the "Google Chart" web part).
Please then configure the web part as follows:

List Name: Name of your document library
Label List Column Name: Created By
Aggregation Type: Count
Chart Type: Vertical Bar



Danny  
11/21/2019 14:05 
thanks Juerg.

Following those instructions, the webpart dispays 'Label column error: Created By|1 (Value does not fall within expected range.)

any ideas where i am going wrong?
Juerg  
11/21/2019 18:39 
Danny,
can you temporarily enter

trace=1

into the web part’s „Options“ setting and then send us the additional output generated by the web part for analysis to support@amrein.com ?
Danny Creighton  
11/24/2019 21:23 
No problem. I have emailed.
Tobi  
11/25/2019 13:32 
On some charts the labels get cut off. (https://i.imgur.com/ltWvt9a.png)
Is the an option to change this?

-Tobi
Juerg  
11/25/2019 14:38 
Tobi,
to make the vertical axis labels visible, please enter a value into the web part’s “Vertical Axis Label” setting (eg. do not leave it empty).
Gary  
11/27/2019 12:22 
Pointing this to a library, and selecting a 'Created By' field as the 'Label List Column Name'

I am getting the error 'data list column not specified or not found'

what am i doing wrong?
Juerg  
11/27/2019 14:33 
Gary,
assuming that you want to disply the number of documents created by each user, please make sure to set the "Aggregation Type" web part setting to "Count".
Gary  
11/29/2019 22:16 
Having followed that instruction all the webpart displays is a lot of rows that displays 'Label column error: Created By|1 (Value does not fall within expected range.)

Juerg  
12/2/2019 14:03 
Gary,
in case you specified a list view in the web part's "View Name" setting, please then make sure to include the "Created By" column in your list view.
James Olorunosebi  
12/8/2019 20:54 
Please regarding your charting tool. I have a data I need to represent with the following conditions.

The data exists in a SharePoint List, and there is a column containing when certain software licenses expires.
I want to create an Obsolescence Chart that lets me know THE COUNT of those software that will expire using these conditions.

<=31/12/2010 (Less than or Equal to December 31st 2010)
>=1/1/2011 <=31/12/2013 (Greater than January 1 2010 but less than December 31 2013)
>=1/1/2014 <=31/12/2017 (Greater than January 1 2014 but less than December 31 2017)
>=1/1/2018 <=31/12/2021 (Greater than January 1 2018 but less than December 31 2021)
>=1/1/2022 <=31/12/2025 (Greater than January 1 2022 but less than December 31 2025)
>=1/1/2025 (Greater than or Equal to January 1 2025)

I have created Views that match this requirements. How do I tell the chart to select all 6 views and display the graph in 3D horizontal bar chart?
Juerg  
12/9/2019 11:34 
Hi James,

the Chart web part is not able to chart multiple list views, so you will need to create a calculated column for each date range as for example:

=IF(AND([Expires]>DATE(2011,1,1),[ Expires]<DATE(2013,12,31)),1,0)

Please make sure to set the column data type to “Number”.

Please then configure the web part as shown below by entering your 6 column names, separated by commas:

Data List Column Name:
Range1,Range2, etc..

Label List Column Name:
sum

Aggregation Type:
Sum
James Olorunosebi  
12/9/2019 14:12 
Thanks! Worked like a Dr.Strange sorcery! :-)

Technical Support Contact Information
If you find that you cannot resolve an issue using the above tools, our Technical Support staff will be ready to handle your technical support needs. You can reach our staff by phone or by email.

Phone: +41 (0)62 823 75 75 (9am - 5pm GMT)
Fax : +41 (0)62 823 75 74
Email: support@amrein.com
 
© 2019 AMREIN ENGINEERING AG


Great product! Easy install, just what we needed to get some quick wins!

Lisa McMillan, Georgian College


Subscribe to Newsletter
If you want to be kept informed about our new or enhanced Sharepoint web parts, subscribe to our Sharepoint Web Part Newsletter:

You can also subscribe to our Web Part News RSS Feed:

RSS Feed

Follow us on Twitter:

Web Part News
Free SharePoint "Call to Action" Web Part

8/27/2019

The free "Call to Action" web part allows to easily publish a call to action button, including some descriptive text.
The Web Part can be used with Sharepoint 2010, Sharepoint 2013, Sharepoint 2016 and Sharepoint 2019.
The following parameters can be configured:
  • Button label
  • Title and descriptive text
  • Target URL
  • Background (color or image to draw the viewers’ attention)
SharePoint Exchange Upcoming Events Web Part

8/27/2019

The Exchange Upcoming Events Web Part displays the appointments of the selected Microsoft Exchange mailbox(es) or Exchange public folder calendars as a list.
The Web Part can be used with Windows Sharepoint Services V3, MOSS, Sharepoint 2010, Sharepoint 2013, Sharepoint 2016 and Sharepoint 2019.

The following parameters can be configured:
  • daily, weekly and monthly view
  • Aggregation: Mailbox Calendars and/or Public Folder calendars to be displayed
  • group the list by calendar or date
SharePoint Chart Web Part

2/21/2019

Since Google will disable support for their Image Chart web service on March 14, 2019, we now announce the new Chart web part which uses the Google Visualization Chart web service.

The AE Chart Web Part can be used with Sharepoint 2010, Sharepoint 2013, Sharepoint 2016 and Sharepoint 2019.
SharePoint Quick Links Web Part

2/17/2019

The Quick Links Web Part allows to easily set up a menu with icons based on a Sharepoint List.
The Web Part can be used with Sharepoint 2010, Sharepoint 2013, Sharepoint 2016 and Sharepoint 2019.
The Quick Links Web Part lets you:
  • use a Sharepoint Links List to define the menu items
  • choose a horizontal, vertical, or a fixed or fluid grid layout with or without icons
  • use Font Awesome icons and/or Microsoft Office Fabric icons
  • CSS styles to customize the look and feel
  • apply Security trimming by Sharepoint groups or AD groups
  • define personal link menus (each user can configure his/her own menu)
SharePoint Image Menu Carousel Web Part

2/1/2019

The Image Menu Carousel Web Part displays the pictures contained in a Sharepoint Picture Library arranged horizontally. The images scroll automatically (as a slide show), via buttons and/or via swipe.
The Image Menu Carousel Web Part optionally displays the image title and/or the image description. Each image can optionally be linked in order to create an image menu.

The Web Part can be used with Sharepoint 2010, Sharepoint 2013, Sharepoint 2016 and Sharepoint 2019 .